title: How to pass a lot of images to jquery ui tooltip
body: <p>i'm using jquery UI tooltip. Here's a usage.</p>
  
  <pre><code>&lt;a href="#" title="Enter Text Here" data-imgurl="Image-URL" class="fiwTooltip"&gt;Aumkar Thakur&lt;/a&gt;
  </code></pre>
  
  <p>And here is JS file</p>
  
  <pre><code>$(document).ready(function() {
  $('.fiwTooltip').hover(function(){
          var title = $(this).attr('title');  //Getting Title Text
          var imgurl = $(this).attr('data-imgurl'); // Getting Image URL
          $(this).data('tipText', title).removeAttr('title');
      $('&lt;div class="tooltip"&gt;&lt;p class="txttooltip"&gt;'+title+'&lt;/p&gt;&lt;img src="'+imgurl+'" class="imgtooltip"/&gt;')
          .appendTo('body')
          .fadeIn('slow');
  }, function() {
          $(this).attr('title', $(this).data('tipText'));
          $('.tooltip').remove();
  }).mousemove(function(e) {
          var mousex = e.pageX + 20; //Get X coordinates
          var mousey = e.pageY + 10; //Get Y coordinates
          $('.tooltip')
          .css({ top: mousey, left: mousex })
  });
  });
  </code></pre>
  
  <p>Everything works fine with a single image, but what if I want to add not only one image to <strong><em>data-imgurl="Image-URL"</em></strong> (i have collection of user avatars and I need to pass them all to one tooltip). How can I solve my problem?</p>