JQuery - Validar Formulario con Jquery Validator

<meta charset="utf-8">

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">

<div class="progress">

    <div class="progress-bar progress-bar-striped active"></div>

  </div>

  <form id="regiration_form" novalidate action="action.php"  method="post">

  <fieldset>

    <h2>Paso 1 Registro</h2>

    <div class="form-group">

    <label for="email">Email</label>

    <input type="email" class="form-control" id="email" name="email" placeholder="Email">

    </div>

    <div class="form-group">

    <label for="contrasena">Contraseña</label>

    <input type="password" class="form-control" id="password" placeholder="Password">

    </div>

    <input type="button" name="siguiente" class="siguiente btn btn-info" value="siguiente" />

  </fieldset>

  <fieldset>

    <h2> Paso 2 información personal</h2>

    <div class="form-group">

    <label for="fName">Primer Nombre</label>

    <input type="text" class="form-control" name="fName" id="fName" placeholder="Primer Nombre">

    </div>

    <div class="form-group">

    <label for="lName">Segundo Nombre</label>

    <input type="text" class="form-control" name="lName" id="lName" placeholder="Segundo Nombre">

    </div>

    <input type="button" name="atras" class="atras btn btn-default" value="atrás" />

    <input type="button" name="siguiente" class="siguiente btn btn-info" value="siguiente" />

  </fieldset>

  <fieldset>

    <h2>Paso 3: información de Contacto</h2>

    <div class="form-group">

    <label for="mob">Número telefónico</label>

    <input type="text" class="form-control" id="mob" placeholder="Número telefónico">

    </div>

    <div class="form-group">

    <label for="address">Dirección</label>

    <textarea  class="form-control" name="Dirección" placeholder="Dirección"></textarea>

    </div>

    <input type="button" name="atras" class="atras btn btn-default" value="atrás" />

    <input type="submit" name="Enviar" class="Enviar btn btn-success" value="Enviar" />

  </fieldset>

  </form>

<div class="row">

	<div class="col-md-11 col-md-offset-1">

<strong>Para este ejercicio de registro de formulario estamos usando la función <code>field-set control</code> nativa de HTML la cual busca donde termina un <code>fieldset</code> y el contenido lo coloca por etapas.

</div></div>

<style type="text/css">

  #regiration_form fieldset:not(:first-of-type) {

    display: none;

  }

  </style>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>

  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>

<script>

	$(document).ready(function(){

  var barra =true,paso_actual,etapa,etapas;

  etapas = $("fieldset").length;

  $(".siguiente").click(function(){

    paso_actual = $(this).parent();

    etapa = $(this).parent().next();

    etapa.show();

    paso_actual.hide();

    asignarProgresoBarra(++barra);

  });

  $(".atras").click(function(){

    paso_actual = $(this).parent();

    etapa = $(this).parent().prev();

    etapa.show();

    paso_actual.hide();

    asignarProgresoBarra(--barra);

  });

  asignarProgresoBarra(barra);

  // Change progress bar action

  function asignarProgresoBarra(progreso){

    var percent = parseFloat(100 / etapas) * progreso;

    percent = percent.toFixed();

    $(".progress-bar")

      .css("width",percent+"%")

      .html(percent+"%");

  }

});

</script>