title: TypeError: jQuery(...).hexColorPicker is not a function
body: <p>im trying to use color-picker jquery plugin. 
  here is the screenshot of javascript file :
  <a href="https://i.stack.imgur.com/ovRjx.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/ovRjx.png" alt="enter image description here"></a>
  here is it my code to initialize it : </p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
          jQuery(function(){
              jQuery("#color-picker1").hexColorPicker();
          });
      &lt;/script&gt;
  </code></pre>
  
  <p>here is it the html element to trigger it : </p>
  
  <pre><code>&lt;input type="text" id="color-picker1" class="form-control" /&gt;
  </code></pre>
  
  <p>but the plugin doesnt show. and it resulting a console log : </p>
  
  <blockquote>
    <p>TypeError: jQuery(...).hexColorPicker is not a function</p>
  </blockquote>
  
  <p>script placement : </p>
  
  <pre><code>&lt;script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"&gt;&lt;/script&gt;
       &lt;link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.11.0/themes/smoothness/jquery-ui.css" /&gt;
       &lt;script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.11.0/jquery-ui.min.js"&gt;&lt;/script&gt;
       &lt;script src="&lt;?php echo base_url()?&gt;assets/color_picker/src/jquery-hex-colorpicker.min.js"&gt;&lt;/script&gt; &lt;!-- color picker plugin--&gt;
       &lt;link rel="stylesheet" href="&lt;?php echo base_url()?&gt;assets/color_picker/css/jquery-hex-colorpicker.css" /&gt; &lt;!-- color picker plugin--&gt;
  </code></pre>