jQuery Colour Picker - Dynamic Selector

Hey Guys, basically what im trying to do is use the one instance for all the colour selectors on my page. The code im using is this.

$('.color').ColorPicker({ 
        color: '#0000ff',
    onShow: function (colpkr) { $(colpkr).fadeIn(500); return false; },
    onHide: function (colpkr) { $(colpkr).fadeOut(500)开发者_Go百科; return false; },
    onChange: function () { $(this).css('backgroundColor', '#' + hex);}
});

The problem is though, the onChange function doesnt select $(this) as the selector clicked, but changes the colour of the colour picker ui itself.

How do I reference the actual value while still keeping it dynamic to any color selector on the page?

The plugin im using is http://www.eyecon.ro/colorpicker/

Thanks, Warren

• DEMO: http://so.devilmaycode.it/jquery-colour-picker-dynamic-selector

$(function() {
  $('.color').ColorPicker({
  color: '#0000ff',
  onShow: function (colpkr) { $(colpkr).fadeIn(500); return false; },
  onHide: function (colpkr) { $(colpkr).fadeOut(500); return false; },
  onSubmit: function(hsb, hex, rgb, el) {
    $(el).val(hex);
    $(el).ColorPickerHide();
    $(el).css('backgroundColor', '#' +hex);
  }});  
});