JSFiddle - React, Tailwind, and code Playground

HTML

<h1>class</h1>
<ul>
    <li>first</li>
    <li class="alternate">second</li>
    <li>third</li>
    <li class="alternate">fourth</li>
</ul>

<hr />

<h1>class + structural selectors</h1>
<ul class="striped">
    <li>first</li>
    <li>second</li>
    <li>third</li>
    <li>fourth</li>
</ul>

<hr />

<h1>inline style</h1>
<ul>
    <li>first</li>
    <li style="background-color: #CCC">second</li>
    <li>third</li>
    <li style="background-color: #CCC">fourth</li>
</ul>

CSS

h1 {
    margin: 5px 0;
    font-size: 1.25em;
    font-weight: bold;
}

.alternate {
    background-color: #CCC;
}

.striped :nth-child(2n) {
    background-color: #CCC;
}