title: tooltip not showing on first mouseover
body: <p>I am using jquery-ui's (1.10.2) tooltip widget and I am experiencing an annoying error.
  The tooltip won't show on the first mouseover. It does when I mouseout and re-mouseover and everytime after that. Just not the first time. This is my code:</p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;img src="btn-tooltip-info.png" class="tooltip" title="Your text here"/&gt;
  </code></pre>
  
  <p>javascript:</p>
  
  <pre><code>$(document).ready( function() {
  
      $(document).on("mouseover", ".tooltip", function(e){
          $(this).tooltip({
              content: function() {
                  return $(this).attr('title');
              },
              position: { my: "left+15 center", at: "right center" }
          });
      });
  });
  </code></pre>
  
  <p>I'm using on() because other processes might dynamically change the html after initial load.
  I'm at a loss here, any insights would be greatly appreciated.
  Thanks in advance for any help.</p>