In a div, there is a ul. Inside a li, there is another ul. The task is to select only the first ul inside the div using jQuery.
The HTML markup:
<div class="parent">
<div class="clearfix">
<div class="another-div">
<ul class="first-ul">
<li>First</li>
<li>Second</li>
<li>Third</li>
<li>Fourth</li>
<li>Fifth</li>
<li>
<ul class="second-ul">
<li>First</li>
<li>Second</li>
<li>Third</li>
<li>Fourth</li>
<li>Fifth</li>
</ul>
</li>
</ul>
</div>
</div>
</div>
The goal is to target the first-li only by utilizing the parent class without specifying any other classes. Attempts with $('.parent > ul') and $('.parent ul') have been made, but both resulted in targeting both ul elements. Avoiding the use of the first-ul class or any additional classes is preferred.