从数组中更改徽章颜色

Question

var colorr = ["#008000", "#e0ffc1", "#ffc1e1", "#cc0000"];
   $.each(sortable.reverse(), function(key, value){
     $('#results').append("<li><h3>" +  value[0] + ": <span class='badge' 
       style='background-color: var(cl); font-size: 25px ;'>"+ value[1] + "% 
</span></h3></li>");
               })

此代码的输出将如下：

即用徽章显示四个百分比。

现在在下面的代码中迭代循环时，我想从代码中声明的colorr数组中更改这些fours数字的徽章颜色。

如何实现这个目标？

Answer 1

试试这个

background-color: '+colorr[key]+';

工作代码示例

var colorr = ["#008000", "#e0ffc1", "#ffc1e1", "#cc0000"];
$(colorr).each(function (key, value) {
    $('body').append('<li><h3><span class="badge" style="background-color:' + colorr[key] + '; font-size: 25px ;">Hi</span></h3></li>');
})

DEMO