Attaching event handler to each table cell at runtime
<p>I have created a table at design time and adding rows to it at runtime.
I want to attach a mouseover event to each row of first column which displays the respective tooltip.</p>

<pre><code>for(ctr=0;ctr&lt;noOfRows;ctr++){
   var myTable=document.getElementById("myTable");
   var newRow = myTable.insertRow(1);

   var cell0 = newRow.insertCell(0);
   cell0.innerHTML="Cell Data"+"&lt;div class='hiddenToolTip' id='tip"+ctr+"'&gt;"+tooltip+"&lt;/div&gt;";

   cell0.onmouseover=function(){
        $("#tip"+ctr).show('blind',500);
   };

   cell0.onmouseout=function(){
        $("#tip"+ctr).hide();
   };
}
</code></pre>

<p>The problem is that the 'ctr' variable is always coming as the highest value inside 'onmouseover' and 'onmouseout' function.</p>
