jQuery count div that has a display:none attribute

Question

I want to count the div that has a class name "items" and has an attribute "style=display:none". ```

2

3

``` the output should be '3'. =========================================================== addition to the problem: ```

2

3

``` the output should be '3' & '5'.

Accepted Answer

Original:

```
var count = $('div.items:hidden').length;
```

New:

```
var counts = {};
$('#skills1,#skills2').each( function() {
    counts[$(this).attr('id')] =  $('div.items:hidden', $(this)).length;
}
```

The `counts` object will be:

```
{ skills1 : 3, skills2 : 5 }
```

Last(?)

```
$('#skills1,#skills2').each( function() {
    if ($('div.items:hidden',$(this)).length == 0) {
        $(this).hide();
    }
});
```

It would be even easier if you gave the "containers" a class to use as a selector. Then you could simply replace `#skills1,#skills2` with the class selector and not have the function be dependent on the names of the DIVs, meaning that it wouldn't have to change if you add another container, say `skills3`. You'd just have to make sure to give that container the correct class.

jQuery count div that has a display:none attribute

Solution

Problem