Question

I have a table with rows in it.

I want to highlight the different rows as I use the down or enter key. I have the keypress event working but I’m having issue with changing the current row to the original non-highlighted class.

I have figured out how to change the value of the next row, but I would need to reset the value from the row I’m coming from.

This is the code that I’m using to change the next “TR” to the highlighted class:

$(a).closest("tr").next().toggleClass("LUGridRowHighlight");

Please let me know.

Update:

I have a table with 5 rows of data.
My keypress code will eventually move up or down the table with the 5 rows

“a” represents the tablerow element

When I press the down arrow (keycode 40) I want to change the currently selected row that has class LUGridRowHighlight to just LUGridRow. Then I want to change the row below to the highlight class.

Right now all I can do is change the row below to the highlighted class. I want to also change the class of the row I’m coming from.

Answer 1

You can set all of the “non-highlighted” rows to the “non-highlighted” class:

$('#table_id tr').removeClass("LUGridRowHighlight");