Javascript jQuery-在名称中使用“：：”设置对象的样式

我正在自定义输入范围和滑块对象的外观，我已经成功地使用此CSS完成了这项工作：

input[type="range"] {
    -webkit-appearance: none !important;
    background: rgba(1,1,1,0.3);
    height:6px;
    border: solid 1px #000;
    border-bottom: solid 1px #1d1d1d;
    border-radius: 6px;
    width: 48px;
    margin: 0;
    margin-bottom: 4px;
    display: block;

}

input[type="range"]::-webkit-slider-thumb {
    -webkit-appearance: none !important;
    background: -webkit-linear-gradient(top, #a2a2a2 0%,#8b8b8b 50%,#7b7b7b 100%);
    height:10px;
    width:10px;
    box-shadow: inset 0 1px 0 #C4C4C4;
    border-radius: 10px;
}

这段代码可以100%工作，但是我想做的是使用jQuery更改滑块输入[type=range]：-webkit slider thumb的背景色

我可以通过以下方式更改主框的边框：

$('input#volume').css('background', '#FFFFFF');

但是我不知道如何使用jQuery获得滑块。 谢谢

---

仅供参考，我只针对Mac上的Safari WebKit，因此缺少其他浏览器支持，它适用于应用程序

这称为伪元素，您无法使用jQuery直接访问它。您可以改为修改文档的样式表，以覆盖输入[type=range]：：-webkit-slider-thumb的规则。为什么不给您的输入一个类，并以这种方式将其作为目标？@ckaufman如果可以，我会这样做，但我很确定我不能这样做。@BoltClock我到底怎么做？颜色必须是完全动态的。