JSFiddle - React, Tailwind, and code Playground

by jslayer

HTML

<table>
    <tr>
        <td>A1</td><td>B1</td><td>C1</td>
    </tr>
    <tr>
        <td>A2</td><td>B2</td><td>C2</td>
    </tr>
    <tr>
        <td>A3</td><td>B3</td><td>C3</td>
    </tr>
    <tr>
        <td>A4</td><td>B4</td><td>C4</td>
    </tr>
</table>
<button id="toggle">toggle</button>

CSS

table {
    border-collapse: collapse;
}

table.zebra tr:nth-child(even) {
    background: red;
    color: #fff;
}

JavaScript

var $table = $('table');

$('#toggle').click(function(){
    $table.toggleClass('zebra')
})