Set parent style via child

Let’s say I have the following <ul>:

<ul>
<li>Child</li>
<li><span class="active">Child</span></li>
<li>Child</li>
</ul>

Is it possible for me to change the style of the <li> via the active <span>?

E.g.:

.active:parent(li) {
    background-color: red;
}

I’ve been able to achieve this with jQuery, but it flickers on the screen for a split second (waiting for the DOM to load) and I want to avoid that.

Leave a Comment