Question

I am trying to see if any inputs have the class “invalid” with JQuery.

$('#formId input').hasClass('invalid'); 

is returning false. Even after I’ve used .addClass('invalid') on an input and verified with Chrome’s DOM inspector that the class is present.

The below suggestions are not working. My markup is a little bit different than just form>input though.

http://jsfiddle.net/Jv4tG/

Answer 1

Just use the class-name as a selector:

$('#formId input.invalid');

This will only operate on those elements that have that class, otherwise, as a conditional, you can use length:

if ($('#formId input.invalid').length) {
    // some elements have that class
}

You could also use filter():

$('#formId input').filter(function(){
    return $(this).hasClass('invalid');
});

Which will limit the selector to only those elements with that class, or:

$('#formId input').filter(function(){
    return !$(this).hasClass('invalid');
});

To return those elements that do not have the invalid class-name.