jQuery event bubbling: Get original element mouseover (for table row highlighting)

Answer 1

You can attach the mouseover event to the table but every time you mouseover any child element of the table that fuction will fire.

$('#myTable').mouseover(function(e) {
  $(e.target).parents('tr');
});

That will get you the tr of element that was hovered.

Answer 2

It's called event delegation.

You're using jQuery which makes it trivial to find the triggering <tr> element of the event, via closest:

$('#myTable').mouseover(function(event) {
    var tr = $(event.target).closest('tr');
    // do something with the <tr> element...
})

closest was in fact written to support event delegation like this. It's what live() uses internally.

Answer 3

Colin, that has the possibility of getting more then 1 parent.
If you have two tables nested you would get back 2 tr objects.

The name already suggests that as it is .parents

.closest('tr') is the best and correct way.