JSFiddle - React, Tailwind, and code Playground

by ChrisStanyon

HTML

<table>
    <tr>
        <td>1</td>
        <td>2</td>
        <td>3</td>
    </tr>
    <tr>
        <td>1</td>
        <td>2</td>
        <td>3</td>
    </tr>
    <tr>
        <td>1</td>
        <td>2</td>
        <td>3</td>
    </tr>
</table>

CSS

table { border-collapse: collapse; }
td { padding: 10px; }
.hover { color: blue; background-color:red; }

JavaScript

$('td').hover(function() {
    var col = $(this).index() + 1;
    var table = $(this).parents('table');
    $('tr>td:nth-child('+col+')', table).toggleClass('hover');
});