title: JQuery UI Tooltip with data attributes
body: <p>I'm attempting to use HTML5 data attributes to store and display content for a tooltip.</p>
  
  <p>I'm using JQuery UI for the tooltip.</p>
  
  <p>I've read the documentation, but haven't figured out how to program the right selector and display the custom data.</p>
  
  <p>Any ideas of what I'm missing?</p>
  
  <p><a href="http://jsfiddle.net/QsEJk/2/" rel="noreferrer">http://jsfiddle.net/QsEJk/2/</a></p>
  
  <p><strong>HTML:</strong></p>
  
  <pre><code>&lt;span class="info-icon"
      data-title="custom title"
      data-desc="custom description"&gt;
  &lt;/span&gt;
  </code></pre>
  
  <p><strong>JS:</strong></p>
  
  <pre><code>$( '.info-icon' ).tooltip({
      content: function() {
          return 'Title: ' + $( this ).data('title') +
                 ' Description: ' + $( this ).data('desc');
      }
  });
  </code></pre>