How do I select only first-level li's? If I do 'ul li', it also selects the children. Is there a way to select only the top level and not the children using CSS? If not, I am ok with using jQuery, but how would I select it in that case too?
<ul>
<li class="administration first">
<a href="/administration.aspx"><span>Administration</span></a>
<ul>
<li class="users first selected"><a href="/administration/users.aspx"><span>Users</span></a></li>
<li class="forms last"><a href="/administration/forms.aspx"><span>Forms</span></a></li>
</ul>
<div style="clear: both;"></div>
</li>
<li class="analytics"><a href="/analytics.aspx"><span>Analytics</span></a></li>
<li class="options"><a href="/options.aspx"><span>Options</span></a></li>
<li class="system last"><a href="/system.aspx"><span>System</span></a></li>
</ul>
You would need the element or class which is above the first ul, then specify {parent-selector} > ul > li
.
$("ul:first > li").
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With