if (typeof (jQuery) === 'undefined') { alert('jQuery Library NotFound.'); } try { $('table tr td').hover(function() { var hoverIndex = $(this).index(); $(this).parents('table').find('td').filter(':nth-child('+(hoverIndex+1)+')').addClass('linghtbar'); },function() { $(this).parents('table').find('td').removeClass('linghtbar'); }); } catch (err) { };
<table width="300px"> <tr class="tr1"> <td>1</td> <td>2</td> </tr> <tr class="tr2"> <td>3</td> <td>4</td> </tr> <tr class="tr1"> <td>5</td> <td>6</td> </tr> <tr class="selected"> <td>7</td> <td>8</td> </tr> <tr class="tr1"> <td>9</td> <td>0</td> </tr> </table>
.tr1{ background-color: #e9e9e9; } .tr2{ background-color: #ffffff; } .selected{ color:#000000; background-color: #ffefd5; } .linghtbar{ color:#000000; background-color: #d9e9ff; }