title: How to create custom color picker drop down using jQuery UI select menu?
body: <p>I'v been trying to create a custom drop down that will contain color name along with the color chip(shade of the color). The drop down would be dynamically populated by the options that I would provide as input in the form of array of colors. 
  Basically, What I am trying to achieve is this:
  <a href="https://i.stack.imgur.com/iewyo.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/iewyo.png" alt="target to achieve"></a></p>
  
  <p>So, I used jQuery UI selectmenu plugin which provides an option to put 'icons' along with the text in the drop down: <a href="https://jqueryui.com/selectmenu/#custom_render" rel="nofollow noreferrer">selectmenu icon</a>. I am planning to replace icons with the color chip. 
  I am planning to use <code>_renderItem</code> of <code>selectmenu</code> to do this and have so far achieved this:
  [<img src="https://i.stack.imgur.com/FviPM.png" alt="target achieved so far[3]"> 
  The color of font here is the color of color chip that I want to be displayed along with the text. I do get the rgb value of color. Here is the implementation so far:</p>
  
  <pre><code>$.widget("custom.iconselectmenu", $.ui.selectmenu, {
              _renderItem: function (ul, item) {
                  console.log(item);
                  var li = $("&lt;li&gt;")
                      .css("color", "#"+item.value); //changing color with item.value
  
                  if (item.disabled) {
                      li.addClass("ui-state-disabled");
                  }
  
                  this._setText(li, item.label);
  
                  return li.appendTo(ul);
              }
          });
  
  
  
   $("#DropDownID")
              .iconselectmenu()
              .iconselectmenu("menuWidget");
  
  for (var i = 0; i &lt; Color.Data.length; i++) {
                  $("#DropDownID").append($("&lt;option&gt;&lt;/option&gt;").val(Color.Data[i].RgbValue).html(Color.Data[i].ColorName));
              }
  </code></pre>
  
  <p>Can you help me in achieving the color chip and text format in the drop down as mentioned earlier by replacing the current javascript code?</p>