Suppose i have an HTML table. How do I use JQuery events on this?

<table>
    <tr class="myRow"><td class="col1"></td><td class="col2"></td></tr>
    <tr class="myRow"><td class="col1"></td><td class="col2"></td></tr>
开发者_Python百科    <tr class="myRow"><td class="col1"></td><td class="col2"></td></tr>
    <tr class="myRow"><td class="col1"></td><td class="col2"></td></tr>
    <tr class="myRow"><td class="col1"></td><td class="col2"></td></tr>
</table>

How do I make the appropriate col1 fill with the letters "ABC" when the user rollovers the row?

And then disappear the "ABC" when the user moves the mouse away from that row?

So far, I got this. I solved it.

  $(".ep").hover(function(){
        $(this).find('td.playButtonCol').html('PLAY');
    },function(){
        $(this).find('td.playButtonCol').html('');
    });

Use the mouseenter and mouseleave events.

$('.col1').mouseenter(function(){ ... });
$('.col1').mouseleave(function(){ ... });

    $(".col1").hover(
function(){
 $(this).html = ('abc');
    )};

Your question is a little vague but if I understand you correctly you want to hover over a row and put a value in one particular cell in that row. If so, that's relatively easy:

$("tr").hover(function() {
  $(this).children(".col1").html("ABC");
}, function() {
  $(this).children(".col1").html("");
});

you means something like this?:

$('.col1').hover(function() {
    $(this).html('ABC');
}, function() {
    $(this).html('');
});