CSS no sibling selector

Issue

Consider the following html:

<div>
    <div class="iwant" />
    <div class="idontwant" />
</div>
 <div>
    <div class="iwant" />
</div>

I'm interested in a selector (for crawling content so I can't modify html) that would select all iwant that DO NOT have sibling with class idontwant.

Solution

There is no sibling selector to match elements (or not) by class.

The closest selector I can think of is

.iwant:only-child

But this selector means that there cannot be any other elements besides that div class="iwant" as children of the parent div, regardless of type or class. This may fulfill your need depending on the structure of your HTML though, so it's worth a try. If class names are a problem for you, though, then there probably isn't much of a solution, because there isn't an :only-of-class pseudo-class in CSS which filters by class and ignores the rest.

Answered By - BoltClock