使用jquery应用不同的背景颜色

我在父div中有一个子div的集合，子div是动态生成的，并且都具有相同的类名。

我的问题是如何使用下面的jquery示例代码为每个子div应用不同的背景颜色

 
...
 
...
 
...
 
...
 
...
  

在这里，我想为每个子div应用不同的背景颜色（class =“bars”）

提前致谢。

Answer 1

像这样的东西：

 var colors = ["f00", "0f0", "00f", "ff0", "0ff", "f0f"]; $('#someid .bar').each(function(i) { $(this).css('background-color', '#'+colors[i % colors.length]); }); 

要生成随机颜色，您可以使用：

 function randomColor() { return 'rgb('+ Math.round(Math.random()*255)+', '+ Math.round(Math.random()*255)+', '+ Math.round(Math.random()*255)+')' } $('#someid .bar').each(function(i) { $(this).css('background-color', randomColor()); }); 

演示：

http://jsbin.com/eqoyi4

Answer 2

问题我已经回答了，但无论如何; 如果要显示特定颜色的阴影（在此示例中为#ffcc33 ）：

 $(document).ready(function() { $('.bar').each(function(i) { var j = $('.bar').length; $(this).css('background-color', 'rgb(' + Math.floor(0xff / j * (i + 1)) + ', ' + Math.floor(0xcc / j * (i + 1)) + ', ' + Math.floor(0x33 / j * (i + 1)) + ')'); }); }) 

http://www.jsfiddle.net/BEcvG/

Answer 3

 $('DIV.bar').each(function(i,e){ $(this).css('backgroundColor','rgb('+Math.round(255/i)+','+Math.round(255/i)+','+Math.round(255/i)+')'); });