Why Not Work wear Append Multiple jQuery -

i have form client code , want display message if form must filled before form submitted.

if 1 append work, after add 1 not working.

is there solution?

this code:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>  <form id='id_form' action='signup.php' method='post'>   <label for='name'>your name:</label>   <input type='text' id='name' name='name' value=''/>   <span class='name'></span>   <br />    <label for='username'>username:</label>   <input type='text' id='username' name='username' value=''/>   <span class='username'></span>   <br />    <input id="test" type="submit" value="submit" /> </form>  <script>   $('#test').click(function(){      if ($('#name').val()=='') {       $('.name').append(' name required')       return false     }     else {       return true     }      if ($('#username').val()=='') {       $('.username').append(' username required')       return false     }     else {       return true     }   })    $('#name').click(function(){     $('.name').html('')   })    $('#username').click(function(){     $('.username').html('')   }) </script> 

it because using:

return false; 

in middle, , abruptly stops execution. need is, collect errors, , @ end, if there errors, return false.

have error flag this:

$('#test').click(function() {   var error = false;    if ($('#name').val() == '') {     $('.name').append(' name required');     error = true;   }    if ($('#username').val() == '') {     $('.username').append(' username required');     error = true;   }    return !error; }); 

and please, don't forget ; @ end of each statement.