不能在沒有孩子的列表中選擇一個

Question

您可以讓我知道誰只選擇父母<a>元素而不是第2項中的子列表？

我想要做的是在1至5項和ITEM2

不子<a>人會補充.red類唯一的<a>第一層

 $(".the-list a:not(:has(ul))> a").each(function() { 
 
     $(this).addClass('red'); 
 
    });

.red{color:red;}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="the-list"> 
 
<ul> 
 
    <li><a>Item 1</a></li> 
 
    <li><a>Item 2</a> 
 
    <ul> 
 
     <li><a>Item 2-1</a></li> 
 
     <li><a>Item 2-2</a></li> 
 
     <li><a>Item 2-3</a></li> 
 
     <li><a>Item 2-4</a></li> 
 
     <li><a>Item 2-5</a></li> 
 
    </ul> 
 
    </li> 
 
    <li><a>Item 3</a></li> 
 
    <li><a>Item 4</a></li> 
 
    <li><a>Item 5</a></li> 
 
    <li><a>Item 6</a></li> 
 
</ul> 
 
</div>

Answer 1

>限制會做它。

$(".the-list > ul > li > a").each(function() { 
 
    $(this).addClass('red'); 
 
});

.red{color:red;}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="the-list"> 
 
<ul> 
 
    <li><a>Item 1</a></li> 
 
    <li><a>Item 2</a> 
 
    <ul> 
 
     <li><a>Item 2-1</a></li> 
 
     <li><a>Item 2-2</a></li> 
 
     <li><a>Item 2-3</a></li> 
 
     <li><a>Item 2-4</a></li> 
 
     <li><a>Item 2-5</a></li> 
 
    </ul> 
 
    </li> 
 
    <li><a>Item 3</a></li> 
 
    <li><a>Item 4</a></li> 
 
    <li><a>Item 5</a></li> 
 
    <li><a>Item 6</a></li> 
 
</ul> 
 
</div>

Answer 2

試試這個選擇ul > li > a