JSFiddle - React, Tailwind, and code Playground

HTML

<p>Selecting elements that have certain children:</p>
<ul>
    <li>item 1</li>
    <li>item 2
        <ul>
            <li class="active">item 1.1</li>
            <li>item 1.2</li>
        </ul>
    </li>
</ul>        
<p>The background-color should be grey.</p>

CSS

ul {
    list-style-type: disc;
    padding-left: 20px;
}
li.active {
    color: red;
}
ul.highlight1 {
    border: 1px solid red;
}
ul.highlight2 {
    background-color: #efefef;
}
p {
    padding: 1em 0em;
}

JavaScript

// this works
$("ul:has(>li.active)").addClass("highlight1");

// this fails
$("ul").has(">li.active").addClass("highlight2");