使用颜色选择器更改多个元素的颜色

Question

我试图找出如何使用＆＃34;更改＆＃34;类来改变所有元素的颜色。使用Really Simple Bootstrap Color Picker。这是JS代码。

$(function() {
  var $inputs = $('input.color');
  $inputs.colorPicker({pickerDefault: '#99CCFF'});

  $inputs.each(function(idx, item) {
    var $input = $(item);
    var $target = $input.parents('.control-group:first').find('label:first');
    $target.css('color', $input.val());

    $input.on('colorPicker:preview colorPicker:change', function(e, value) {
      $target.css('color', value);
    });

    $input.on('colorPicker:addSwatch', function(e, value) {
      //do something with custom color (e.g. persist on the server-side)
    });
  });
});

HTML（我不打算为我的所有元素使用表单。以下所有元素都没有＆＃34;更改＆＃34;。我只包含了我原来的代码。）

<form class="form-horizontal">
  <div class="control-group">
    <label class="control-label">Pick a Color</label>
    <div class="controls input-prepend">
      <input type="text" name="color" class="color addSwatch" />
    </div>
  </div>
  <div class="control-group">
    <label class="control-label">Pick a Color</label>
    <div class="controls input-prepend">
      <input type="text" name="color" class="color input-small" />
    </div>
  </div>
</form>