設置兒童背景顏色列表

Question

我有一個點亮，像這樣：

<ul id="categoria"> <br> 
    <li><a href="#">Categoria1</a></li> 
    <li><a href="#">Categoria2</a> 
     <ul class="sub-menu"> 
      <li><a href="#">Esercizio1</a></li> 
      <li><a href="#">Esercizio2</a></li> 
     </ul> 
    </li> 
    <li><a href="#">Categoria3</a></li> 
    <li><a href="#">Categoria4</a> 
     <ul class="sub-menu"> 
      <li><a href="#">Esercizio1</a></li> 
      <li><a href="#">Esercizio2</a></li> 
     </ul> 
    </li> 
    <li><a href="#">Categoria5</a></li> 
</ul> 

我想設置背景顏色，例如紅，但只是爲了列表的孩子。所以在這種情況下，Esercizio1，Esercizio2，ecc。與jQuery。怎麼可能做到這一點？我只知道要做整個名單。

Answer 1

這工作： Demo here

$(".sub-menu li > a").css('background-color','red'); 

Answer 2

試試這個代碼：

$('.sub-menu li').css('background', 'red'); 

Answer 3

可以是這樣做的：

$('element').children().css({'background-color':'red'}); 

你的情況：

$('ul li').children().css({'background-color':'red'}); 

一個更詳細的版本：

$(".elementClassName li").children().css({'background-color':'red'}); 

您可以指定例如僅p標籤的孩子：

$(".elementClassName li").children('p').css({'background-color':'red'}); 

Answer 4

您可以使用此選擇。

$("#categoria li ul li > a").css({backgroundColor: "red" }); 

或

$(".sub-menu li > a").css({backgroundColor: "red" }); 

See demo here

您可以瞭解jQuery selectors here。

---

這也可以用CSS來實現：

#categoria li ul li > a { background-color: red; } 

或

.sub-menu li > a { background-color: red; }