JSFiddle - React, Tailwind, and code Playground
by tymeJV
HTML
<div class="main">
<div class="main_child_1">
<ul>
<li>Lorem Ipsum</li>
<li>Lorem Ipsum</li>
</ul>
<ul>
<li>Lorem Ipsum</li>
<li>Lorem Ipsum</li>
</ul>
</div>
<div class="main_child_2">
<ul>
<li>Lorem Ipsum</li>
<li>Lorem Ipsum</li>
<li>Lorem Ipsum</li>
<li>Lorem Ipsum</li>
<li>Lorem Ipsum</li>
</ul>
</div>
<div class="main_child_3">
<p>Lorem Ipsum</p>
</div>
<div class="main_child_4">
<ul>
<li>Lorem Ipsum</li>
<li>Lorem Ipsum</li>
<li>Lorem Ipsum</li>
<li>Lorem Ipsum</li>
</ul>
<div class="main_child_4_child_1">
<p>Lorem Ipsum</p>
</div>
<div class="main_child_4_child_2">
<ul>
<li>Lorem Ipsum</li>
<li>Lorem Ipsum</li>
<li>Lorem Ipsum</li>
</ul>
</div>
</div>
<div class="main_child_5">
<p>Lorem Ipsum</p>
<div class="main_child_5_child_1">
<p>Lorem Ipsum</p>
</div>
<div class="main_child_5_child_2">
<ul>
<li>Lorem Ipsum</li>
<li>Lorem Ipsum</li>
<li>Lorem Ipsum</li>
<li>Lorem Ipsum</li>
<li>Lorem Ipsum</li>
<li>Lorem Ipsum</li>
</ul>
</div>
</div>
<div class="main_child_6">
<ul>
<li>Lorem Ipsum</li>
<li>Lorem Ipsum</li>
<li>Lorem Ipsum</li>
</ul>
<div class="main_child_6_child_1">
<p>Lorem Ipsum</p>
</div>
<div class="main_child_6_child_2">
<ul>
<li>Lorem Ipsum</li>
<li>Lorem Ipsum</li>
<li>Lorem Ipsum</li>
<li>Lorem Ipsum</li>
<li>Lorem Ipsum</li>
<li>Lorem Ipsum</li>
</ul>
</div>
<div class="main_child_6_child_3">
<p>Lorem Ipsum</p>
</div>
</div>
</div>
-------------------------------------------
<div class="main2">
<div class="main_child_1">
<ul>
<li>Lorem Ipsum</li>
<li>Lorem Ipsum</li>
</ul>
<ul>
<li>Lorem Ipsum</li>
...
CSS
.target {
color: red;
}
JavaScript
$("div").filter(function() {
return $(this).children("ul").children().length > 3
}).addClass("target");