title: Jquery-ui tooltip on click
body: <p>I'm trying to make a jquery-ui tooltip show/hide on a click event. Also I don't want it to show hide on mouse enter/leave.</p>
  
  <p>Here is a fiddle with a normal tooltip : <a href="http://jsfiddle.net/Michael_0/sLhD9/" rel="nofollow">http://jsfiddle.net/Michael_0/sLhD9/</a>
  (unfortunately jsfiddle doesn't seem to be able to include jquery-ui from google cdn ?).</p>
  
  <p>I had the idea to disabled the tooltip at initialization then enable it on click just before showing it, it works but I can't prevent the tooltip from hiding when the mouse leaves the target.</p>
  
  <pre><code>$("#myDiv").tooltip({
      disabled: true,
      content: function () {
          return "&lt;div&gt;Custom content&lt;/div&gt;"
      }
  });
  
  $("#myDiv").click(function () {
          $(this).tooltip("option", "disabled", false);
          $(this).tooltip("open");
      });
  </code></pre>