CODEWITHSUNDEEP
jquery
Chanpory
Chanpory

Reputation: 3095

Jquery: selecting elements that do not only have children with the same class name?

How do I make a jQuery selector that selects all elements with the class name "foo", except for those that ONLY have children with the class name of "bar".

<!-- Don't select this -->
<div class="foo">
    <div class="bar"></div>
    <div class="bar"></div>
    <div class="bar"></div>
    <div class="bar"></div>
    <div class="bar"></div>
</div>

<!-- Don't select this -->
<div class="foo">
    <div class="bar"><p>Some text</p></div>
    <div class="bar"></div>
    <div class="bar"></div>
    <div class="bar"><p>Some text</p></div>
    <div class="bar"></div>
</div>


<!-- Select this -->
<div class="foo">
    <p>Some text</p>
    <div class="bar"></div>
    <div class="bar"></div>
    <div class="bar"></div>
    <div class="bar"></div>
</div>

<!-- Select this -->
<div class="foo">
    <p>Some text</p>
</div>

Upvotes: 1

Views: 64

Answers (1)

David Hedlund
David Hedlund

Reputation: 129792

Something like this?

$('.foo > :not(.bar)').closest('.foo');

Demo

Start from all .foo, find immediate children except those that have the bar class, and revert back to the .foo.

Upvotes: 2

Related Questions