title: Custom content for each qTip tooltip
body: <p>I have a list of search results and for each one I want to be able to display more information about the result in question in a tooltip.</p>
  
  <p>I have got as far as getting a qTip tooltip to appear when I rollover each a element but I don't understand how to get custom content into the tooltip for each result.</p>
  
  <p>I guess this is largely because of my very limited jQuery knowledge.</p>
  
  <p>In old style JavaScript I would pass a variable that was the tooltip content from the function call attached to the <code>&lt;a&gt;</code> tags. As there is no function call written in the <code>&lt;a&gt;</code> tag for jQuery tooltip it looks like this isn't the way to do it now.</p>
  
  <p>Currently I have this in the head:</p>
  
  <pre><code>&lt;script type="text/javascript" 
         src="/assets/templates/unaexchange/js/jquery.qtip-1.0.0.min.js"&gt;&lt;/script&gt;
  
  &lt;script&gt;
  $(document).ready(function() {
  $(".tooltip").qtip({
     content: 'this is the content',
     position: {
        corner: {
           target: 'topRight',
           tooltip: 'bottomLeft'
        }
     }
  });
  });
  </code></pre>
  
  <p>And then the body has <code>&lt;a class="tooltip"&gt;Link&lt;/a&gt;</code> and then I have the standard :</p>
  
  <pre><code>&lt;div class="qtip qtip-stylename"&gt;
    &lt;div class="qtip-tip" rel="cornerValue"&gt;&lt;/div&gt;
    &lt;div class="qtip-wrapper"&gt;
      &lt;div class="qtip-borderTop"&gt;&lt;/div&gt; 
               &lt;!-- Only present when using rounded corners--&gt;
      &lt;div class="qtip-contentWrapper"&gt;
          &lt;div class="qtip-title"&gt; 
               &lt;!-- All CSS styles...--&gt;
          &lt;div class="qtip-button"&gt;&lt;/div&gt; 
               &lt;!-- ...are usually applied...--&gt;
      &lt;/div&gt;
      &lt;div class="qtip-content"&gt;an attempt at standard content ?&gt;&lt;/div&gt; 
               &lt;!-- ...to these three elements!--&gt;
    &lt;/div&gt;
    &lt;div class="qtip-borderBottom"&gt;&lt;/div&gt; 
               &lt;!-- Only present when using rounded corners--&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>But this isn't being displayed and I don't know how to create a specific chunk of HTML for each tooltip. </p>
  
  <p>Is my approach wrong?</p>
  
  <p>Should I create all the individual tooltips containing the custom content with separate IDs and then pick these IDs up and display or something like that? </p>