Implementing Jquery validations

Step 1: Include the following cdns in your html file:
 <link href="http://cdnjs.cloudflare.com/ajax/libs/jquery-form-validator/2.3.26/theme-default.min.css" rel="stylesheet" type="text/css"/>
 <script src="http://cdnjs.cloudflare.com/ajax/libs/jquery-form-validator/2.3.26/jquery.form-validator.min.js"></script>

Step 2: Create the html form as like following:
  <form id="frmLogin" action="" method="POST">
    <div class="group">
      <input id="email" type="email" data-validation="email" data-validation-error-msg="Invalid e-mail.">
      <span class="highlight"></span>
      <span class="bar"></span>
      <label>E-mail</label>
    </div>
    <div class="group">
      <input id="password" type="password" data-validation="required" data-validation-error-msg="Password is required.">
      <span class="highlight"></span>
      <span class="bar"></span>
      <label>Password</label>
    </div>
    <button id="login" type="submit" class="button buttonBlue">Sign in
      <div class="ripples buttonRipples">
        <span class="ripplesCircle"></span>
      </div>
    </button>
    <p id="lblError" style="color:red"></p>
  </form>

Step 3: Add the following js code in your js file:
$(document).ready(function(){
  // initialize the form submition
    InitSubmitForm("#frmLogin", processLogin);
});
function processLogin()
{
 //Do login logic here
}
 // Initialize validations on submit forms. To more customize please read Plugin Documentation here: // http://www.formvalidator.net/#configuration
 function InitSubmitForm(formId, callback) {
            //set form validations
            $.validate({
                form: formId,
                validateOnBlur: true,
                scrollToTopOnError: false,
                onSuccess: function ($form) {
                    callback();
                    return false;
                }
            });
 }