I'd like to know if a style class exists and if yes, how many elements have it.

To know if a style class exists, I use:

if ($("*").hasClass('ui-state-active')) {
    alert("class exist : "+nb_checked);
}

But to know how many elements have the class, I can't figure out.

I'd like to know if a style class exists and if yes, how many elements have it.

To know if a style class exists, I use:

if ($("*").hasClass('ui-state-active')) {
    alert("class exist : "+nb_checked);
}

But to know how many elements have the class, I can't figure out.

• javascript
• jquery
• html
• css
• dom

7 Answers 7

This is a simpler approach:

$('.ui-state-active').length

Just do:

$('.ui-state-active').length

if($('.ui-state-active').length){
     alert("class exist : "+$('.ui-state-active').length);
}

Doc here :

http://api.jquery./length/

You can use this for both

c = $('.ui-state-active').length;
if (c>0) {
    console.log('There is '+c+' elements having required class');
}

Using jQuery, you can directly select all elements which have a certain class. The syntax for this is the same as that for CSS selectors:

$(".className")

This creates a jQuery object, which is a collection of the matched elements. There are many useful properties of this object, one of which is length, the number of elements in the collection.

In your case, finding the number of required elements is as trivial as

$(".ui-state-active").length

You could do both in one go:

var elements = $('.ui-state-active');
if(elements.length === 0) {
    alert('No elements with class ui-state-active!')
} else {
    alert(elements.length +  ' elements with class ui-state-active');
}

How about:

$(".ui-state-active").length;