JSFiddle - React, Tailwind, and code Playground

by Moes

HTML

<div class='car-id-1'>car-id-1</div>
<div class='car-id-1'>car-id-1</div>
<!-- repeated -->
<div class='car-id-2'>car-id-2</div>
<div class='car-id-2'>car-id-2</div>
<!-- repeated -->
<div class='car-id-3'>car-id-3</div>
<div class='car-id-3'>car-id-3</div>
<!-- repeated -->
<div class='car-id-4'>car-id-4</div>
<div class='car-id-5'>car-id-5</div>

CSS

.car-id-1, .car-id-2, .car-id-3, .car-id-4, .car-id-5 {
    display: none;
}

.car-id-1 ~ .car-id-1 ,
.car-id-2 ~ .car-id-2 ,
.car-id-3 ~ .car-id-3 ,
.car-id-4 ~ .car-id-4 ,
.car-id-5 ~ .car-id-5 {
   display: block;
}