更改列表元素的类别

Question

我想将每个列表（#list）项目的类别更改为Array上的对应项目。我有一个列表是这样的：

<ul id="list"> 
    <li>Banana</li> 
    <li>Apple</li> 
    <li>Pear</li> 
    <li>Strawberry</li> 
    <li>Lemon</li> 
</ul> 

我有此数组：

["ban", "appl", "per", "straw", "lemn"] 

我想的是，jQuery.addClass()功能改变与class每个项目的顺序，因为它们是在Array。结果如下：

<ul id="list"> 
    <li class="ban">Banana</li> 
    <li class="appl">Apple</li> 
    <li class="per">Pear</li> 
    <li class="straw">Strawberry</li> 
    <li class="lemn">Lemon</li> 
</ul> 

我该怎么办？

Answer 1

这should work为您提供：

var classes = ["ban", "appl", "per", "straw", "lemn"]; 

$('#list > li').addClass(function(index) { 
    return classes[index]; 
}); 

你可以看到这个过载（就是那个需要function(index, currentClass)回调）on the jQuery website的文档。

Answer 2

$('#list > li').each(function(i){ 
    $(this).addClass(myArray[i]); 
}); 

Answer 3

var myArray = ["ban", "appl", "per", "straw", "lemn"]; 
$("#list > li").each(function(index) { 
    $(this).addClass(myArray[index]); 
}); 

Answer 4

$.each(myArray, function(i, value){ 
     $('#list li').eq(i).addClass(value); 
    } 
);