JSFiddle - React, Tailwind, and code Playground

HTML

<div id="copy-cat">
  <li class="">1</li>
  <li class="">2</li>
  <li class="">3</li>
  <li class="">4</li>
</div>

<div id="carousel">
  <div class="active">1</div>
  <div class="">2</div>
  <div class="">3</div>
  <div class="">4</div>
</div>

CSS

.active {
    color: red
}

JavaScript

$("#carousel div").click(function(e) {
    $("div.carousel-inner>li.active").removeClass("active");
    $("#copy-cat :nth-child("+(1+$(e.target).index()) + ")").addClass("active");
});