title: Eric Hynds multiselect widget conflicts with jquery ui tooltip widget
body: <p><a href="http://jsfiddle.net/robz1330/3jr2v/127/" rel="nofollow">Here is a js fiddle</a></p>
  
  <p>JS</p>
  
  <pre><code>$(function(){
      $("select").multiselect();
      $( document ).tooltip();
      $( document ).tooltip( "option", "position", { my: "left+20 center", at: "right center" } );
  });
  </code></pre>
  
  <p>HTML</p>
  
  <pre><code>&lt;select multiple="multiple" size="5"&gt;
  &lt;optgroup label="England"&gt;
      &lt;option title="example 1" value="London"&gt;London&lt;/option&gt;
      &lt;option title="example 2" value="Leeds"&gt;Leeds&lt;/option&gt;
      &lt;option title="example 3" value="option3"&gt;Manchaster&lt;/option&gt;
  &lt;/optgroup&gt;
  &lt;optgroup label="USA"&gt;
      &lt;option title="example 4" value="option4"&gt;New York&lt;/option&gt;
      &lt;option title="example 5" value="option5"&gt;Chicago&lt;/option&gt;
  &lt;/optgroup&gt;
  &lt;/select&gt;
  </code></pre>
  
  <p>I'm using Eric Hynds' multiselect widget as well as the jQuery UI tooltip widget with jQuery 1.9.1. </p>
  
  <p>I want tooltips to appear when the user hovers over each item in the multiselect widget. To do this, I defined a 'title' attribute for each option within the widget. This works just fine, except that the multiselect widget also has it's own tooltips that appear which contain each option <em>value</em>. Therefore, I get <strong>two</strong> tooltips for each option. </p>
  
  <p>I would like to either disable the multiselect's inherent tooltips, or make my own tooltips work with another attribute besides 'title' (So far I can't find any other attributes that will work inside an  tag).  Or, any other ideas?</p>