Added new features; tweaked equality comparers

Hi -- great start to your lightweight validation plugin. I've made some changes:

1. Changed `!=` and `==` to `!==` and `==` wherever necessary.

2. Modified the 'description` to use `defaults` by default, and to append class names (instead of replacing html content) to described-by elements:

    description : {
       defaults : {
       required : 'error',
       pattern : 'warning',
       conditional : 'warning',
       valid : ''
       }
    } 

3. Set a default to do all field validation whenever the onChange/onBlur/etc event happens -- this is important because many validations are conditional, and these were not getting reset unless all validation was performeD:

    validateAllOnChange: true,

4. Added a `describedby-msg` data- option so that helper messages can be included in the validation.

5. Changed the `validation` return string to be an object `{ valid: true|false, msg: 'Helper message' }` so that the msg comes across as well.

6. Defined a `defaults` callback so explicit setting of `data-describedby`, `data-description`, and `data-describedby-msg` are not needed -- the function can add them...

7. A `customTypes` object so I can bind validation to non `input` fields

For completeness sake, below is how I'm using the whole thing. One more note: I would consider refactoring the plugin to conform to the plugin best practices using a single `methods` param and the `data` object o maintain state.

    $('#formId').validate({
        sendForm: false
        , submitForm: true
        , onChange: true
        , customTypes: {
             fields: ".dropdown-toggle"
            , isInvalid: function() { 
                 return $(this).data("value");
              }
            , bindEvents: function(cb) {
                  $(".dropdown-toggle[data-required]").siblings(".dropdown-menu").children("li").children("a").bind("click", function(e) {
                                    cb(e);
                                });
                }
           }
          , invalid: function() {
                 //form is not valid for submission...
           }
           , valid: function() {
                //form is valid
           }
           , defaults: {
                  describedBy: function() {
                       return $(this).parents(".control-group");
                  }
                  , describedByMsg: function() {
                        return $(this).siblings(".help-inline");
                  }
            }
            //what makes the validation PASS?
             , conditional: {
                    eitherLocalIdNonexistentOrMatchesStateConfirmation: function() {
                         if ($("#confirmStateId").val() !== $(this).val()) {
                            return {valid: false, msg: 'State IDs must match'};
                          } else if ($("#localId").val() === "" && $("#confirmStateId").val() === "" && $(this).val() === "") {
                              return {valid: false, msg: 'A State ID is required if Local ID is missing'};
                           } else {
                              return {valid: true, msg: ''};
                           }
                       }
                        , onlyIfStateIdMissing: function() {
                                if ($("#stateId").val() === "") {
                                    return {valid: false, msg: "A Local ID is required if the State ID is missing"};
                                } else {
                                    return {valid: true, msg: ""};
                                }
                          }
                         , confirmStateId: function() {
                                if ($(this).val() === $("#stateId").val())
                                    return {valid: true, msg: ''};
                                else
                                    return {valid: false, msg: 'Must match State ID'};
                            }
                          , needGender: function() {
                                return false;
                            }
                        }
                        , description : {
                            defaults : {
                                required : 'error',
                                pattern : 'warning',
                                conditional : 'warning',
                                valid : ''
                            }
                        } 
                    });

HTML:

    <form class="validate form-horizontal">
    <div class="control-group" id="stateIdRow">
        <label class="control-label" for="stateId">State ID</label>
        <div class="controls">
            <input id="stateId" type="text" placeholder="State ID" data-conditional="eitherLocalIdNonexistentOrMatchesStateConfirmation" />
            <span class="help-inline" id="stateIdMsg"></span>
        </div>
    </div>
    <div class="control-group" id="confirmStateIdRow">
        <label class="control-label" for="confirmStateId">Confirm State ID</label>
        <div class="controls">
            <input type="text" id="confirmStateId" placeholder="Confirm State ID" data-conditional="confirmStateId" />
            <span class="help-inline" id="confirmstateidmsg"></span>
        </div>
    </div>
    <div class="control-group">
        <label class="control-label" for="localId">Local Id<br /><small><em>(District or otherwise)</em></small></label>
        <div class="controls">
            <input type="text" id="localId" placeholder="Local ID" data-conditional="onlyIfStateIdMissing" />
             <span class="help-inline" id="localIdMsg"></span>
       </div>
    </div>

    <hr />

    <div class="control-group">
        <label class="control-label">Name</label>
        <div class="controls controls-row">
            <input type="text" class="span3" id="studentFirstName" placeholder="First" data-required />
            <input type="text" class="span3" id="studentMiddleName" placeholder="Middle" />
            <input type="text" class="span3" id="studentLastName" placeholder="Last" data-required />
        </div>
    </div>

    <div class="control-group">
        <label class="control-label">Nickname</label>
        <div class="controls">
            <input type="text" id="nickName" placeholder="Nick Name" />
        </div>
    </div>

    <div class="control-group">
        <label class="control-label">Date of Birth</label>
        <div class="controls">
            <input type="text" id="studentDOB" class="datepicker" placeholder="DOB" data-required/>
        </div>
    </div>

    <hr />

    <div class="control-group">
        <label class="control-label">Grade</label>
        <div class="controls">
            <div class="btn-group">
                <a class="btn btn-primary dropdown-toggle" id="studentGrade" data-toggle="dropdown" href="javascript:" data-required>
                    <span class="dropdown-toggle-text">Grade</span>
                    <span class="caret"></span>
                </a>
                <ul class="dropdown-menu">
                    {{#each siteGrades}}
                    <li><a tabindex="-1" data-value="{{this}}">{{this}}</a></li>
                    {{/each}}
                </ul>
            </div>
        </div>
    </div>

    <div class="control-group">
        <label class="control-label">Gender</label>
        <div class="controls">
            <div class="btn-group">
                <a class="btn btn-primary dropdown-toggle" id="studentGender" data-toggle="dropdown" href="javascript:" data-required>
                    Gender
                    <span class="caret"></span>
                </a>
                <ul class="dropdown-menu">
                    <li><a tabindex="-1" data-value="male">Male</a></li>
                    <li><a tabindex="-1" data-value="female">Female</a></li>
                </ul>
            </div>
        </div>
    </div>

    <div class="control-group">
        <label class="control-label">Ethnicity</label>
        <div class="controls">
            <div class="btn-group">
                <a class="btn btn-primary dropdown-toggle" id="studentEthnicity" data-toggle="dropdown" href="javascript:" data-required>
                    Ethnicity
                    <span class="caret"></span>
                </a>
                <ul class="dropdown-menu">
                    {{#each ethnicities}}
                    <li><a tabindex="-1" data-value="{{code}}">{{name}}</a></li>
                    {{/each}}
                </ul>
            </div>
        </div>
    </div>

    <div class="control-group">
        <label class="control-label">Home Language</label>
        <div class="controls">
            <div class="btn-group">
                <a class="btn btn-primary dropdown-toggle" id="studentHomeLanguage" data-toggle="dropdown" href="javascript:"data-required>
                    Home Language
                    <span class="caret"></span>
                </a>
                <ul class="dropdown-menu">
                    {{#each homeLanguages}}
                    <li><a tabindex="-1" data-value="{{code}}">{{name}}</a></li>
                    {{/each}}
                </ul>
            </div>
        </div>
    </div>

    <div class="control-group">
        <label class="control-label">English Language (EL)</label>
        <div class="controls">
            <div class="btn-group">
                <a class="btn btn-primary dropdown-toggle" id="studentEL" data-toggle="dropdown" href="javascript:"  data-required>
                    English Language (EL)
                    <span class="caret"></span>data-required
                </a>
                <ul class="dropdown-menu">
                    <li><a tabindex="-1" data-value="yes">Yes</a></li>
                    <li><a tabindex="-1" data-value="no">No</a></li>
                </ul>
            </div>
        </div>
    </div>

    <div class="control-group">
        <label class="control-label">Special Ed</label>
        <div class="controls">
            <div class="btn-group">
                <a class="btn btn-primary dropdown-toggle" id="studentSpecEd" data-toggle="dropdown" href="javascript:" data-required>
                    Special Ed
                    <span class="caret"></span>
                </a>
                <ul class="dropdown-menu">
                    <li><a tabindex="-1" data-value="yes">Yes</a></li>
                    <li><a tabindex="-1" data-value="no">No</a></li>
                </ul>
            </div>
        </div>
    </div>
    </form>