JSFiddle - React, Tailwind, and code Playground

HTML

I need this way:
<table>
    <tr>
        <td>RED</td>
        <td class="foo">BLUE</td>
        <td>RED</td>
        <td class="foo">BLUE</td>
    </tr>
    <tr>
        <td>RED</td>
        <td class="foo">BLUE</td>
        <td>RED</td>
        <td class="foo">BLUE</td>
    </tr>
</table>

Not this:
<table>
    <tr>
        <td>RED</td>
        <td>BLUE</td>
        <td>RED</td>
        <td>BLUE</td>
    </tr>
    <tr class="foo">
        <td>RED</td>
        <td>BLUE</td>
        <td>RED</td>
        <td>BLUE</td>
    </tr>
</table>

CSS

table td{color:red;}
.foo,.foo td{color:blue;}