Javascript jQueryUI：多个滑块具有不同的css句柄

我在一个页面上有12个滑块，我希望分别处理手柄以使用所有不同的颜色。我正在用。每个来构建滑块

    //jquery sliders
    $(function() {
    $("#eq > span").each(function() {
      $( this ).empty().slider({
        orientation: "horizontal",
        animate: true,
        value: 10,
        min: 0,
        max: 10,
        step: 1,
        slide: function( event, ui ) {
          var val = $(this).attr('id');
          weights[val] = ui.value;
          updateSvg();
          if (typeof areaSelected !== 'undefined') {showPiechart(areaSelected); }
          }
        });
      });
     });

在HTML中，它看起来像这样。每个跨度都有一个ID：

 <div id="eq"> 
    <span id="sl11"></span>
 </div>

但是，我不认为我可以使用这个ID来更改滑块本身的颜色。我已经找到了解决方案（），其中每个滑块都是单独构建的，然后调整颜色，但不是在使用.each构建滑块时

---

提前谢谢

在我看来，你有很多选择：

1）随机化每个循环内的颜色：

$（函数（）{
$（“#eq>span”）。每个（函数（）{
$（此）.slider({
方向：“水平”，
动画：对，
数值：10，
分:0,，
最高：10，
步骤：1
});
//随机化颜色
var randRed=Math.floor（Math.random（）*255）；
var randGreen=Math.floor（Math.random（）*255）；
var randBlue=Math.floor（Math.random（）*255）；
$（this.css）({
“背景”：“rgb（“+randRed+”、“+randGreen+”、“+randBlue+”）
});
});
});
#eq>span{
浮动：左；
清除：左；
宽度：300px；
利润率：15px；
}

请为我们提供相关代码。甚至一个代码片段在这里索特感谢你这么精心的回答！非常清楚和有用。但是，我正在尝试修改控制柄的颜色，这会更改滑块本身的背景色。我只通过以下方式在jquery css中更改了它们：.ui滑块-handle@LexHaitsma只需使用
$（this）.children（“.ui滑块句柄”）
选择句柄，然后根据需要更改css