I'm trying to hide the parent DIV if all the child spans have a hidden class. There are other divs with the same class in my document that have one or two hidden spans, but I want to only hide the parent div when all three children have the hidden class.

Here's my HTML:

```
<div class="example">
<span class="hidden">Design</span>
<span class="hidden">Development</span>
<span class="hidden">Branding</span>
</div>

```

I DO NOT want to hide the parent Div if there are any span elements with a class that is visible. So, if the following is true:

```
<div class="example">
<span class="visible">Design</span>
<span class="hidden">Development</span>
<span class="visible">Branding</span>
</div>

```

The example div should still be visible. It should only be visible if all three child spans have the hidden class.

And here's the jQuery I've tried:

```
$('.example').each(function(){
if($('.hidden')(':visible').length == 0) {
$('.example').hide();
}
});

```

Needless to say, it hasn't worked.

Edit: selectors changed - I'd updated my example to be more generic.