title: Build tooltip notes inline instead of on document ready?
body: <p>I have a page loading more than 300 tooltips with about 1000 characters each.  The jQuery UI is doing all the work of creating these div elements. I'd like to know if I can build them inline, and keep them hidden, to speed up fragment caching, and then only attach the handler to the element read from the cache.</p>
  
  <p>Here's the fairly simple JS code to create and handle the tooltips.</p>
  
  <pre><code>  $(function() {
      $(document).tooltip({
        tooltipClass: "notes",
        content: function (callback) {
          callback($(this).prop('title'));
        }      
      });
    });
  </code></pre>
  
  <p>And the simplified view code, which loads the notes for the tooltip into the title attribute of a sortable container.</p>
  
  <pre><code>.portlet
    .portlet-header
      # Some info
    .portlet-content(title="#{ t.notes if t.notes }")
      # more info
  </code></pre>
  
  <p>Fragment caching doesn't seem to help if the JS has to create hundreds of popup elements after I serve the basic info for each <code>.portlet</code> element.  I really appreciate your help.  Thank you.</p>