title: Popover not working for the select option
body: <p>Popover is not working for me. I have tried onChange and mouseover. With "mouseover" onChange() function is never hit. With "change" the onchange function is called but popover still doesn't work. 
  I want onChange function to be called from another function. Here I am just giving the reference function() but In reality its internal function.</p>
  
  <pre><code>&lt;select size="1" name = "selectList" id="selectList"&gt;
      &lt;option value="1" data-info="data1"&gt;Item 1&lt;/option&gt;
      &lt;option value="2" data-info="data2"&gt;Item 2&lt;/option&gt;
      &lt;option value="3" data-info="data3"&gt;Item 3&lt;/option&gt;
      &lt;option value="4" data-info="data4"&gt;Item 4&lt;/option&gt;
  &lt;/select&gt;
  
  $(function() {
  //$("select[name=selectList]").on("change",onChange);
  $("select[name=selectList]").on("mouseover",onChange); 
  });
  function onChange() {
      var $this = $(this);
      var $e = $(this.target);
      $('#selectList').popover('destroy');
      $("#selectList").popover({
          trigger: 'manual',
          placement: 'right',
          content: $this.attr("data-info")
      }).popover('show');
  }   
  </code></pre>
  
  <p><a href="http://jsfiddle.net/xrkxdedg/1/" rel="nofollow">http://jsfiddle.net/xrkxdedg/1/</a></p>