更改列表元素的類別

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); 
    } 
);