title: jQuery Validation plugin not removing error class
body: <p>I'm stuggling with the removeClass from a jQuery function. I'm a newbie when it comes to jQuery and can't really think of an answer after a lot of search and testing.</p>
  
  <p>I'm working with bootstrap. So, here's my HTML.</p>
  
  <pre><code>        &lt;form id="flogin" method="post" action="&lt;?php echo site_url('entrar');?&gt;" class="form-horizontal" role="form"&gt;
  
          &lt;fieldset&gt;
      &lt;div class="input-group"&gt;
          &lt;span class="input-group-addon"&gt;@&lt;/span&gt;
          &lt;input type="email" class="form-control" name="uemail" id="uemail" placeholder="Enter e-mail.."&gt;
          &lt;/div&gt;
      &lt;label for="uemail" class="error"&gt;&lt;/label&gt;
  
          &lt;br /&gt;
      &lt;div class="input-group"&gt;
              &lt;span class="input-group-addon"&gt;&lt;span class="glyphicon glyphicon-chevron-right"&gt;&lt;/span&gt;&lt;/span&gt;
              &lt;input type="password" class="form-control" name="upasswd" id="upasswd" placeholder="Enter password..."&gt;
      &lt;/div&gt;
      &lt;label for="upasswd" class="error"&gt;&lt;/label&gt;
  
          &lt;br /&gt;
          &lt;button type="submit" name="loginBtn" value="Ingresar" class="btn btn-default pull-right"&gt;Login&lt;/button&gt;
      &lt;!--&lt;input name="submit" type="submit" value="Submit"&gt;--&gt;
      &lt;/fieldset&gt;
      &lt;/form&gt;
  </code></pre>
  
  <p>And this is is my jQuery code:</p>
  
  <pre><code>$("#flogin").validate({
      onkeyup:true,
      rules: {
        uemail: "required",
        upasswd: "required",
        uemail: {
          required: true,
          email: true
        },
        upasswd: {
          required: true,
          minlength: 5
        }
      },
      highlight: function(element) {
      $(element).closest('.input-group').removeClass('has-success').addClass('has-error');
    },
    success: function(element) {
      $(element).closest('.input-group').removeClass('has-error').addClass('has-success');
    },
      messages: {
        uemail: "Por favor ingrese su email",
        upasswd: "Por favor ingrese su contraseña",
        uemail: {
          required: "Por favor ingrese su email",
          minlength: "Su e-mail debe ser valido.",
          email: "Verifique que este bien escrito su e-mail"
        },
        password: {
          required: "Por favor ingrese su contraseña",
          minlength: "Tu contraseña debe contener al menos 5 carácteres."
        }
      }
    });
  </code></pre>
  
  <p>I can't make this code work right, it validates but doesn't remove the has-error class after the e-mail has been entered correctly. Although it does add the has-error class when it's wrong but doesn't update when it's entered correctly again.</p>
  
  <p>When I remove this peace of HTML <em></em> it works, but I don't want the message there because it breaks the boxes and doesn't look good.</p>
  
  <p>Any help would be pretty much appreciated. </p>
  
  <p>Thank you.</p>