title: jQuery validation different errors
body: <p>I have a simple html form, with multiple inputs.</p>
  
  <p>I'm using jQuery validation to change de background color of these inputs when the user hit the submit button withouth filling them correctly (I know this is not ideal, but the field names are self explanatory and a red background is enough for me).</p>
  
  <p>However, some of the fields, are type=radio or type=checkbox and I can't change their background colors. I wanted to change the text color of this fields to red, or change the background color of the text to red.
  I don't how to have two different classes applied to different elements from the jQuery validation.</p>
  
  <p>Here are the relevant pieces of my code:</p>
  
  <p>JS:</p>
  
  <pre><code>&lt;script&gt;
      $(document).ready(function(){
          $("#registerForm").validate({
              rules: {
                  firstname: {
                      required: true,
                      minlength: 2
                  },
                  lastname: {
                      required: true,
                      minlength: 2
                  },
                  gender: {
                      required: true  
                  },
                  policy: "required"
              },
              errorClass: 'invalidField'
      });
  &lt;/script&gt;
  </code></pre>
  
  <p>HTML:</p>
  
  <pre><code>&lt;input id="firstname" name="firstname" /&gt;
  
  &lt;input id="lastname" name="lastname" /&gt;
  
  &lt;input type="radio" id="gender" name="gender" value="male" /&gt;Masculino
  &lt;input type="radio" id="gender" name="gender" value="female" /&gt;Feminino
  
  &lt;input type="checkbox" id="policy" name="policy" value="accept" /&gt;Eu li e aceito os termos acima
  </code></pre>
  
  <p>CSS:</p>
  
  <pre><code>.invalidField {
      background-color: #ffdddd;
  }
  </code></pre>
  
  <p>Thanks.</p>