JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://cdn.jquerytools.org/1.2.4/full/jquery.tools.min.js"></script>
<div class="padme">&nbsp;</div>
<table>
    <tr>
        <td>
            <div id="item3" title="My <br> DIV tooltip" class="addtooltip">
                I have a crap pile<br>of content<br>in this div
            </div>
        </td>
    </tr>
    <tr>
        <td>
            <a href="#" title="My <br> other Tooltip" ID="item2" class="addtooltip">link with tooltip</a>
        </td>
    </tr>
    <tr>
        <td>
            <input title="My <br> Tooltip" ID="item1" class="addtooltip" />
        </td>
    </tr>
</table>

CSS

.tooltip {
    display:none;
    background-color:black;
    font-size:12px;
    height:40px;
    width:160px;
    padding:25px;
    color:#fff;    
}

.padme{padding:20px;}
td{padding:20px;}

JavaScript

$(".addtooltip").tooltip();