Apply CSS based on element present

Question

I have html and css as below

ul .cls {
  background-color:yellow
 }

<!--case 1-->
<ul>
<li class="cls">first</li>
</ul>

 <!--case 2-->
<ul>
<li class="cls">second
  <ul><li class="ncls">nested</ul>
</li>
</ul>

I want to apply background color red to my first li(.cls) if li has nested element, or else add yellow.

with javascript i can do, but i'm looking for CSS solution ? Is there any way to achieve this in css