Javascript 使用3种颜色动态设置div的样式

我的要求是我必须用3种颜色动态设置一个div的样式。 我已经用随机颜色应用了这个代码

function randomColors() {

var letters = '0123456789ABCDEF'.split('');
var color = '#';
for (var i = 0; i < 4; i++ ) {
    color += letters[Math.round(Math.random() * 15)];
}
return color;

函数randomColor（）{
变量字母='0123456789ABCDEF'。拆分（''）；
var color='#'；
对于（变量i=0；i<4；i++）{
颜色+=字母[Math.round（Math.random（）*15）]；
}
返回颜色；

}

我只需要重复3种颜色，这将是一个动态循环！我该怎么做

我只想动态设置这3种颜色#09c5f9、#05f6d5、#a42cff

for(i=1; i <= pmap; i++){
      $("#thumbnail"+i).css("background-color",randomColors());
}

for（i=1；i
function）{
变量字母='0123456789ABCDEF'。拆分（''）；
var color='#'；
对于（变量i=0；i<3；i++）{
颜色+=字母[Math.round（Math.random（）*15）]；
}
返回颜色；
}

您可以看到演示，其中div的背景色将随机设置


你可以从那里得到提示。
我可以想出两种方法

1） 如果使用jQuery，最简单的方法是声明三个类并使用jQuery交换它们

CSS：

.teal{
    background-color: #09c5f9;
}
.emerald{
    background-color: #05f6d5;
}
.purple{
    background-color: #a42cff;
}

还有javascript：

$("#some-element").removeClass("teal emerald").addClass("purple");
$("#some-element").removeClass("teal purple").addClass("emerald");
$("#some-element").removeClass("purple emerald").addClass("teal");

2） 这种方式使用裸机JS，还使用了与原始文章中使用的相同的编程风格

var colors = ["#09c5f9", "#05f6d5", "#a42cff"];

function getColor(colorNumber){
    return colors[colorNumber];
}

希望这有帮助

var colors = ["#09c5f9", "#05f6d5", "#a42cff"];

function getColor(colorNumber){
    return colors[colorNumber];
}