JSFiddle - React, Tailwind, and code Playground

by nejj

HTML

<ul>
    <li class="complete">1</li>
    <li class="complete">2</li>
    <li>3</li>
    <li>4</li>
</ul>

CSS

li {
    background-color: green;
}
li.complete:first-child {
    background-color:white;
}
li.complete:first-of-type {
    background-color:red;
}
li.complete:last-of-type {
    background-color:blue;
}
li.complete:last-child {
    background-color:yellow;
}