title: How to display pop up div for dynamically created database elements
body: <p>I have a grid of 40 thumbnails of staff images and I'd like to display additional text (mainly their biography) when the user hovers over each element.</p>
  
  <p>I've tried using Jquery PowerTip (<a href="http://stevenbenner.github.io/jquery-powertip/" rel="nofollow">http://stevenbenner.github.io/jquery-powertip/</a>) which does the job, but I don't know how to dynamically create each tooltip to connect to each thumbnail.</p>
  
  <p>My Javascript skills are quite poor, so I'm hoping someone can show me how to simply display a pop up div unique to each person on hover next to each item?</p>
  
  <pre><code>&lt;div class="people-list-container"&gt;
  &lt;ul class="people-list"&gt;
  
  &lt;a href="/Person/Details/8045"&gt;
      &lt;li&gt;
          &lt;img src="8045.jpg" class="img-polaroid" /&gt;
          Bob Smith                                   
          &lt;br /&gt;
          Australia
      &lt;/li&gt;
  &lt;/a&gt;
  
  &lt;a href="/Person/Details/8046"&gt;
      &lt;li&gt;
          &lt;img src="8046.jpg" class="img-polaroid" /&gt;
          Jill Jane                                   
          &lt;br /&gt;
          Australia
      &lt;/li&gt;
  &lt;/a&gt;
  
  &lt;a href="/Person/Details/8047"&gt;
      &lt;li&gt;
          &lt;img src="8047.jpg" class="img-polaroid" /&gt;
          John Doe                                   
          &lt;br /&gt;
          Australia
      &lt;/li&gt;
  &lt;/a&gt;    
  
  // ETC ETC
  
  &lt;/ul&gt;
  &lt;/div&gt;
  </code></pre>