HTML列表 - 仅将addClass（）应用于第一级LI元素（不是内部元素）

Question

我有以下代码，

$('.main-menu li:nth-child(3)').addClass("active");

但是，HTML看起来像这样......

<ul>
    <li>menu item</li> 
    <li>menu item</li>
    <li>menu item       <!-- Target only this one! -->
        <ul>
            <li>menu item2</li>
            <li>menu item2</li>
            <li>menu item2</li> <!-- not this one -->
        </ul>
   </li>   
</ul>

它将“活动”类添加到LI的两个列表中，任何方式使它只添加一次？谢谢

Answer 1

http://api.jquery.com/child-selector/

使用“立即”子选择器>

$('.main-menu > li:nth-child(3)').addClass("active");

http://jsbin.com/urekah/1/edit