jQuery 将颜色分配给 li 列表

Question

我有 4 个元素，我想为每个链接分配 4 种不同的背景颜色，但我不希望颜色随机化..假设我有这个结构

<div id="div_id">
 <ul>
  <li><a href="#">Home</a></li>
  <li><a href="#">About Us</a></li>
  <li><a href="#">Contact Us</a></li>
  <li><a href="#">More Info</a></li>
 </ul>
</div>

这怎么可能？

我有颜色列表。它们是(绿、蓝、红、黑)

我试过了

$("#div_id ul li").each(function() {
 $(this).css("background","green");
});

老实说，我不知道如何应用这些颜色。我可以将它们存储在一个数组中，但我将如何循环并分配颜色？

Answer 1

​$(document).ready(function(){
    var color=['red','green','blue','yellow'];
    $('#div_id ul li').each(function(i){
        $(this).css('backgroundColor',color[i]);
    });
});​

fiddle 是 here .

当您要求通过在悬停时应用浅色来实现每个元素的悬停效果时，我给了您两个示例1. http://jsfiddle.net/NjqYA/2/ 2. http://jsfiddle.net/NjqYA/4/