Form Validation

<div class="container">
 
  <form class="wufoo" action="" method="post" id="paypal_form">
    <header id="header" class="info">
    <h2>Article Writing Packages</h2>
    </header>
    <ul>
        
       
         <li class="notranslate " id="unameli">
             <label for="Field2" id="title2" class="desc">
              Name
             <span class="req" id="req_2">*</span>
             </label>
            <div>
            <input type="text" class="field text medium" name="uname" id="uname"  placeholder="Name">
           </div>
            <p class="error" style="display:none;" id="runame">This field is required. Please enter a value.</p>
           
          </li>

          <li class="notranslate " id="emailli">
             <label for="Field2" id="title2" class="desc">
              Email For Report
             <span class="req" id="req_2">*</span>
             </label>
            <div>
            <input type="text" name="uemail" id="uemail" class="field text medium" placeholder="E-Mail">
           </div>
            <p class="error" style="display:none;" id="ruemail">This field is required. Please enter a value.</p>
            <p class="error" style="display:none;" id="rvaluemail">Please enter valid email.</p>
          </li>

           <li class="notranslate " id="paypalli">
             <label for="Field2" id="title2" class="desc">
             Paypal Email
             <span class="req" id="req_2">*</span>
             </label>
            <div>
            <input type="text" name="paypal_email" id="payemail" class="field text medium" placeholder="Paypal E-Mail">
           </div>
            <p class="error" style="display:none;" id="rpayemail">This field is required. Please enter a value.</p>
            <p class="error" style="display:none;" id="rvalpayemail">Please enter valid paypal email.</p>
          </li>
      

            
        

        

             <li class="notranslate " id="fo10li2">
             <label for="Field2" id="title2" class="desc">
            Your Total:
             <span class="req" id="req_2">*</span>
             </label>
             <div>
                <input type="text" class="field text medium" readonly="readonly" value="" size="5" name="totalprice1" id="totalprice1">
                <input type="hidden"  value="10.00" size="5" name="totalprice" id="totalprice">
                <span>$</span>
                <input type="hidden" value="1" name="test_mode">
              </div>
            </li>


           <li class="notranslate " id="detailli">
            <label for="Field2" id="title2" class="desc">
            Special Instruction. If any..
            <span class="req" id="req_2">*</span>
            </label>
            <div>         
           <textarea aria-required="true" name="project_details" id="project_details" class="field textarea medium" placeholder="Please enter any topics, keywords or instructions relevant to your order here"></textarea>
            </div>
            <p class="error" style="display:none;" id="rproject_details">This field is required. Please enter a value.</p>
          </li>

       

          <li class="buttons ">
           <div>
           <input type="hidden" value="4HRFixbTfEtRL0yqKVcxx5Vl8OEFJHNwuslashsmpRDHTtjwU=" id="currentPage" name="currentPage">
          <!-- <input type="image" onmousedown="doSubmitEvents();" alt="Submit" src="http://articlesthread.com/clients/medusa/wp-content/uploads/2013/09/pricing.png" class="btImg submit" name="checkout" id="checkout" tabindex="611"> -->
        
         <input type="submit" onclick="return validate()" class="but" name="submit" id="submit" value="Submit" />
          </div>
          </li>

       
        </ul>
  </form>
</div>
<?php } ?>
</div>

<script>
function validate()
        {   
           
         if($('#uname').val().length==0)
         {
             $('#runame').show(); $('#uname').focus();$('#unameli').addClass('error');     
           
            return false;
         }

          if($('#uemail').val().length==0)
         {
             $('#ruemail').show(); $('#uemail').focus();$('#emailli').addClass('error');     
       
            return false;
         }

          var reg = /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,4}$/;
          var emails=$('#uemail').val();
          if(!reg.test(emails))
         {
             $("#rvaluemail").show();$('#uemail').focus(); $('#emailli').addClass('error');
             return false;
         }


           if($('#payemail').val().length==0)
         {
             $('#rpayemail').show(); $('#payemail').focus();$('#paypalli').addClass('error');     
       
            return false;
         }

          var reg = /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,4}$/;
          var emails=$('#payemail').val();
          if(!reg.test(emails))
         {
             $("#rvalpayemail").show();$('#payemail').focus(); $('#paypalli').addClass('error');
             return false;
         }

          if($('#project_details').val().length==0)
         {
             $('#rproject_details').show(); $('#project_details').focus();$('#detailli').addClass('error');     

            return false;
         }
       
       
         return true;
           
     }
 $("#uname").keypress(function(){ $('#runame').hide();  $('#unameli').removeClass('error');});
 $("#uemail").keypress(function(){ $('#ruemail').hide();  $('#emailli').removeClass('error');});
 $("#uemail").keypress(function(){ $('#rvaluemail').hide();  $('#uemail').removeClass('error');});
 $("#payemail").keypress(function(){ $('#rpayemail').hide();  $('#paypalli').removeClass('error');});
 $("#payemail").keypress(function(){ $('#rvalpayemail').hide();  $('#payemail').removeClass('error');});
 $("#project_details").keypress(function(){ $('#rproject_details').hide();  $('#detailli').removeClass('error');});

</script>