CODEWITHSUNDEEP
jqueryhtml-tablerowhighlight
Homer_J
Homer_J

Reputation: 3323

jQuery highlight table row except top one

$('table tr').mouseover(function() {
    $(this).addClass('hovered');
}).mouseout(function() {
    $(this).removeClass('hovered');
});

The following code lets me easily highlight each table row on a mouseover - however, I don't want to highlight the first row.

Any ideas how to achieve this?

Upvotes: 0

Views: 488

Answers (2)

DevlshOne
DevlshOne

Reputation: 8457

$('table tr:gt(0)').mouseover(function() {
    $(this).addClass('hovered');
}).mouseout(function() {
    $(this).removeClass('hovered');
});

In case you don't feel like looking it up, the :gt() modifier represents greater than where the number inside the parans is the zero based index of the element (from the set of elements returned by the selector, in this case table tr). In turn, :lt() is less than, :eq() is equals, and :even and :odd are self-explanatory.

Upvotes: 1

Adil Shaikh
Adil Shaikh

Reputation: 44740

Try this -

$('table tr:not(:first)').mouseover(function() {
    $(this).addClass('hovered');
}).mouseout(function() {
    $(this).removeClass('hovered');
});

Or you can use gt

$('table tr:gt(0)')

Upvotes: 4

Related Questions