Get jQuery UI Tooltip to Show Div Content

http://forum.jquery.com/topic/get-jquery-ui-tooltip-to-show-div-content

by Rob Sedgwick

HTML

<div class="itemzzz">
  <div class="subitem1" alt="mother">Ready</div>
  <div class="subitem2">Steady</div>
  <div class="subitem3">Maintenance</div>
</div>

<table width="100%">
  <tr>
    <td class="smalltext" style="text-align: left;">
      <div id="lddiv1280054">
        <div class="btn-forum btn-like subitem1"><a title2="Agree with this post" onclick="EditMessage('Blah.pl?m-1541541619/id-1280054/a-approve/l-1',1,'','lddiv1280054')">10</a></div>
        <div class="btn-forum btn-dislike subitem2"><a title2="Disagree with this post" onclick="EditMessage('Blah.pl?m-1541541619/id-1280054/a-approve/l-0',1,'','lddiv1280054')">30</a></div>
      </div>
    </td>
    <td class="right smalltext"><span class="nomobile"><strong>Reply:</strong></span> <a href="#num30">30</a> - 39</td>
  </tr>
</table>


<div class="statusRollup1">
<h4>
Wankers
</h4>
  <p>Subitem 1: Nothing to report</p>
  <p>Subitem 2: Nothing to report</p>
  <p>Subitem 3: Scheduled maintenance</p>
</div>
<div class="statusRollup2">
<h4>
Kes
</h4>
  <p>Pig</p>
  <p>Pig</p>
  <p>Drunken bastard</p>
</div>

JavaScript

$.widget("ui.tooltip", $.ui.tooltip, {
  options: {
    content: function() {
      return $(this).prop('title');
    }
  }
});

$(function() {
  $('.subitem1').attr('title', $('.statusRollup1').remove().html())
  $('.subitem2').attr('title', $('.statusRollup2').remove().html())
  $(document).tooltip();
});