Javascript Jquery在单击时更改颜色-旋钮

我在我的网站上使用jquery旋钮来创建一些漂亮的视觉效果。我希望使用单击事件更改颜色。我已经提供了一个我试图实现的简化提琴。我已经试了几个小时了，现在不得不寻求帮助

演示

HTML

维奥拉（在这里拉小提琴，终于找到了我的信条：）

---

你到底想做什么？单击圆时，圆的左侧部分会发生变化。或者您想要其他功能？

<input type='text' id='dial' value='0' />

<a id="chgColor" href="#">Change color on click</a>

$(function () {
    $('#dial').knob({
        min: '0',
        max: '25000',
        fgColor: '#f00'
    });
    $('#dial').val(10927).trigger('change');
});

$('#chgColor').click(function(e){
    e.preventDefault();
    $('#dial').knob({
        min: '0',
        max: '25000',
        fgColor: '#000'
    }); 
});

$(function () {
    $('#dial').knob({
       min: '0',
       max: '25000',
       fgColor: '#f00'
    });
    $('#dial').val(10927).trigger('change');
});

$('#chgColor').click(function(e){
   e.preventDefault();

   $('#dial').trigger(
     'configure',
      {
        min: '0',
        max: '25000',
        "fgColor":"#001"
    }
);
});