jquery tooltipster插件无法正常工作

Question

I'm a newbie to jquery and this question is more so related to javascript than jquery. Any help is appreciated.

I'm using Tooltipster Plugin to create a tooltip everytime i hover over a <td> element in a datatable. To do so, i have looped over each row in the datatable and then selected the <td> element using childnode, and applied the .tooltipster() function. However, the tooltip works only for the 1st row <td> element. Any idea how to get it working for all rows ?

 $('#mytable tbody tr').each(function(){
     //childNode[7] is the <td> element on which i want the tooltip
     $(this.childNodes[7]).tooltipster({    
            animation: 'fade',
            delay: 200,
            theme: 'tooltipster-punk',
            trigger: 'hover',
            interactive: 'true',
            functionBefore : function drawChart() {
  // This isnt needed to understand the problem so i have not pasted the code
}

});
});

Table data

 <td class="tooltip" data-tooltip-content="#chart_div"  style="padding-left:40px" id="storage" >
        <img src="@Url.Content("~/Content/images/database.png")" />   
 </td>

Answer 1

This is a suggestion for you.

If you just need to show a text as tool-tip for your elements, then simply use title.

Usage of title is simple.

For example,

HTML

<div title="your tooltip here">The content of the document......</div>

screenshot

This will be a simple step to solve your issue.