JSFiddle - React, Tailwind, and code Playground

by Alexandru Gatea

HTML

<ul>
    <li>element</li>
    <li>element</li>
    <li class="active">element</li>
    <li>element</li>
    <li>element</li>
    <li>element</li>
    <li>element</li>
    <li>element</li>
    <li>element</li>
</ul>

CSS

li {
    color: grey;
}

.active {
    color: black;
}

.previous {
    color: orange;
}

.next {
    color: blue
}

JavaScript

$('.active').prevAll().addClass('previous');

$('.active').nextAll().addClass('next');