Reputation: 612
I'm trying to write a selector which selects <div>
s with class="my-rating"
only when their children contain none of 3 classes below.
Example html:
<div class="my-rating" id="parentA">
<div class="foo"></div>
</div>
<div class="my-rating" id="parentB">
</div>
<div class="my-rating" id="parentC">
<div class="rating-full-star"></div>
<div class="rating-full-star"></div>
<div class="rating-full-star"></div>
<div class="rating-half-star"></div>
<div class="rating-empty-star"></div>
<div class="bar"></div>
</div>
<div class="my-rating" id="parentD">
<div class="rating-full-star"></div>
<div class="rating-full-star"></div>
<div class="rating-full-star"></div>
<div class="rating-half-star"></div>
<div class="rating-empty-star"></div>
</div>
Where I want to select parentA
and parentB
and exclude C and D.
Something like this:
$('.my-rating').children().filter(':not(.rating-full-star):not(.rating-half-star):not(.rating-empty-star)')
Except that this guy grabs all the children, not the parent. I also tried:
$('.my-rating :not(.rating-full-star,.rating-half-star,.rating-empty-star)')
But that's not grabbing too many items. What can I do here?
Upvotes: 0
Views: 50
Reputation: 1218
Here you are:
$('.my-rating').not(':has(.rating-full-star, .rating-half-star, .rating-empty-star)');
Upvotes: 1
Reputation: 61
If you already have the child tags selected properly you can just grab the parent from them.
$('.my-rating').children().filter(':not(.rating-full-star):not(.rating-half-star):not(.rating-empty-star)').parent();
This will return a parent for each child element in the arr, if you only want one since they will be the same for each sibling you can use:
$('.my-rating').children().filter(':not(.rating-full-star):not(.rating-half-star):not(.rating-empty-star)').parent()[0];
Upvotes: 0