Make Same JS work for different Divisions Elements

I have two parts, First and Second both are sliders, while I slide for First, it happens for Second also, same for other actions. I do not want to use different JS for the same kind of actions, How can I, I tried a lot but failed. both First and Second have the same class. I have a bunch of divisions like this.
You can run and see what I mean.

$(".sliderWrapper1").prop("scrollWidth") > $(".catalog-cover").width() && $(".right-button").show();
const slider = document.querySelector(".sliderWrapper1"),
  preventClick = e => {
    e.preventDefault(), e.stopImmediatePropagation()
  };
let startX, scrollLeft, isDown = !1,
  isDragged = !1;
slider && (slider.addEventListener("mousedown", e => {
  isDown = !0, slider.classList.add("active"), startX = e.pageX - slider.offsetLeft, scrollLeft = slider.scrollLeft
}), slider.addEventListener("mouseleave", () => {
  isDown = !1, slider.classList.remove("active")
}), slider.addEventListener("mouseup", e => {
  isDown = !1;
  const t = document.querySelectorAll("a");
  if (isDragged)
    for (let e = 0; e < t.length; e++) t[e].addEventListener("click", preventClick);
  else
    for (let e = 0; e < t.length; e++) t[e].removeEventListener("click", preventClick);
  slider.classList.remove("active"), isDragged = !1
}), slider.addEventListener("mousemove", e => {
  if (!isDown) return;
  isDragged = !0, e.preventDefault();
  const t = 2 * (e.pageX - slider.offsetLeft - startX);
  slider.scrollLeft = scrollLeft - t
}));
var widthc = $(".catalog-cover").width() - 20;
$(".left-button").hide(), $(".left-button").click((function() {
  $(".right-button").show(), $(".sliderWrapper1").animate({
    scrollLeft: "-=" + widthc + "px"
  })
})), $(".right-button").click((function() {
  $(".left-button").show(), $(".sliderWrapper1").animate({
    scrollLeft: "+=" + widthc + "px"
  })
})), $((function() {
  $(".sliderWrapper1").scroll((function() {
    var e = $(".sliderWrapper1").outerWidth(),
      t = $(".sliderWrapper1")[0].scrollWidth,
      n = $(".sliderWrapper1").scrollLeft();
    matchright = parseInt(t - e);
    matchleft = parseInt(n);
    differencerl = matchright - matchleft;
    differencerl <= 5 ? $(".right-button").hide() : 0 === n ? $(".left-button").hide() : $(".right-button, .left-button").show()
  }))
}))

<link rel="stylesheet" href="https://wallpaperstacks.sgp1.digitaloceanspaces.com/mycss.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<div class="ibox bsh">
  <h4>First</h4>
  <div class="projects-catalog">
    <div class="catalog-cover">
      <i class="left-button"></i>
      <ul class="sliderWrapper1">
        <a class="slide" href="https://wikipedia.org">
          <img height="50" width="50" class="img-circle tags" src="https://images.unsplash.com/photo-1593642532400-2682810df593?ixid=MnwxMjA3fDF8MHxlZGl0b3JpYWwtZmVlZHwxfHx8ZW58MHx8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=60">
          <div class="sidekro">
            Apple
          </div>
        </a>
        <a class="slide" href="https://wikipedia.org">
          <img height="50" width="50" class="img-circle tags" src="https://images.unsplash.com/photo-1593642532400-2682810df593?ixid=MnwxMjA3fDF8MHxlZGl0b3JpYWwtZmVlZHwxfHx8ZW58MHx8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=60">
          <div class="sidekro">
            Banana
          </div>
        </a>
        <a class="slide" href="https://wikipedia.org">
          <img height="50" width="50" class="img-circle tags" src="https://images.unsplash.com/photo-1593642532400-2682810df593?ixid=MnwxMjA3fDF8MHxlZGl0b3JpYWwtZmVlZHwxfHx8ZW58MHx8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=60">
          <div class="sidekro">
            Orange
          </div>
        </a>

        <a class="slide" href="https://wikipedia.org">
          <img height="50" width="50" class="img-circle tags" src="https://images.unsplash.com/photo-1593642532400-2682810df593?ixid=MnwxMjA3fDF8MHxlZGl0b3JpYWwtZmVlZHwxfHx8ZW58MHx8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=60">
          <div class="sidekro">
            Apple
          </div>
        </a>
        <a class="slide" href="https://wikipedia.org">
          <img height="50" width="50" class="img-circle tags" src="https://images.unsplash.com/photo-1593642532400-2682810df593?ixid=MnwxMjA3fDF8MHxlZGl0b3JpYWwtZmVlZHwxfHx8ZW58MHx8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=60">
          <div class="sidekro">
            Banana
          </div>
        </a>
        <a class="slide" href="https://wikipedia.org">
          <img height="50" width="50" class="img-circle tags" src="https://images.unsplash.com/photo-1593642532400-2682810df593?ixid=MnwxMjA3fDF8MHxlZGl0b3JpYWwtZmVlZHwxfHx8ZW58MHx8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=60">
          <div class="sidekro">
            Orange
          </div>
        </a>
        <a class="slide" href="https://wikipedia.org">
          <img height="50" width="50" class="img-circle tags" src="https://images.unsplash.com/photo-1593642532400-2682810df593?ixid=MnwxMjA3fDF8MHxlZGl0b3JpYWwtZmVlZHwxfHx8ZW58MHx8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=60">
          <div class="sidekro">
            Apple
          </div>
        </a>
        <a class="slide" href="https://wikipedia.org">
          <img height="50" width="50" class="img-circle tags" src="https://images.unsplash.com/photo-1593642532400-2682810df593?ixid=MnwxMjA3fDF8MHxlZGl0b3JpYWwtZmVlZHwxfHx8ZW58MHx8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=60">
          <div class="sidekro">
            Banana
          </div>
        </a>
        <a class="slide" href="https://wikipedia.org">
          <img height="50" width="50" class="img-circle tags" src="https://images.unsplash.com/photo-1593642532400-2682810df593?ixid=MnwxMjA3fDF8MHxlZGl0b3JpYWwtZmVlZHwxfHx8ZW58MHx8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=60">
          <div class="sidekro">
            Orange
          </div>
        </a>
        <a class="slide" href="https://wikipedia.org">
          <img height="50" width="50" class="img-circle tags" src="https://images.unsplash.com/photo-1593642532400-2682810df593?ixid=MnwxMjA3fDF8MHxlZGl0b3JpYWwtZmVlZHwxfHx8ZW58MHx8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=60">
          <div class="sidekro">
            Apple
          </div>
        </a>
        <a class="slide" href="https://wikipedia.org">
          <img height="50" width="50" class="img-circle tags" src="https://images.unsplash.com/photo-1593642532400-2682810df593?ixid=MnwxMjA3fDF8MHxlZGl0b3JpYWwtZmVlZHwxfHx8ZW58MHx8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=60">
          <div class="sidekro">
            Banana
          </div>
        </a>
        <a class="slide" href="https://wikipedia.org">
          <img height="50" width="50" class="img-circle tags" src="https://images.unsplash.com/photo-1593642532400-2682810df593?ixid=MnwxMjA3fDF8MHxlZGl0b3JpYWwtZmVlZHwxfHx8ZW58MHx8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=60">
          <div class="sidekro">
            Orange
          </div>
        </a>

        <a class="slide" href="https://wikipedia.org">
          <img height="50" width="50" class="img-circle tags" src="https://images.unsplash.com/photo-1593642532400-2682810df593?ixid=MnwxMjA3fDF8MHxlZGl0b3JpYWwtZmVlZHwxfHx8ZW58MHx8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=60">
          <div class="sidekro">
            Apple
          </div>
        </a>
        <a class="slide" href="https://wikipedia.org">
          <img height="50" width="50" class="img-circle tags" src="https://images.unsplash.com/photo-1593642532400-2682810df593?ixid=MnwxMjA3fDF8MHxlZGl0b3JpYWwtZmVlZHwxfHx8ZW58MHx8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=60">
          <div class="sidekro">
            Banana
          </div>
        </a>
        <a class="slide" href="https://wikipedia.org">
          <img height="50" width="50" class="img-circle tags" src="https://images.unsplash.com/photo-1593642532400-2682810df593?ixid=MnwxMjA3fDF8MHxlZGl0b3JpYWwtZmVlZHwxfHx8ZW58MHx8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=60">
          <div class="sidekro">
            Orange
          </div>
        </a>
        <a class="slide" href="https://wikipedia.org">
          <img height="50" width="50" class="img-circle tags" src="https://images.unsplash.com/photo-1593642532400-2682810df593?ixid=MnwxMjA3fDF8MHxlZGl0b3JpYWwtZmVlZHwxfHx8ZW58MHx8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=60">
          <div class="sidekro">
            Apple
          </div>
        </a>
        <a class="slide" href="https://wikipedia.org">
          <img height="50" width="50" class="img-circle tags" src="https://images.unsplash.com/photo-1593642532400-2682810df593?ixid=MnwxMjA3fDF8MHxlZGl0b3JpYWwtZmVlZHwxfHx8ZW58MHx8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=60">
          <div class="sidekro">
            Banana
          </div>
        </a>
        <a class="slide" href="https://wikipedia.org">
          <img height="50" width="50" class="img-circle tags" src="https://images.unsplash.com/photo-1593642532400-2682810df593?ixid=MnwxMjA3fDF8MHxlZGl0b3JpYWwtZmVlZHwxfHx8ZW58MHx8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=60">
          <div class="sidekro">
            Orange
          </div>
        </a>
        <a class="slide" href="https://wikipedia.org">
          <img height="50" width="50" class="img-circle tags" src="https://images.unsplash.com/photo-1593642532400-2682810df593?ixid=MnwxMjA3fDF8MHxlZGl0b3JpYWwtZmVlZHwxfHx8ZW58MHx8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=60">
          <div class="sidekro">
            Pine
          </div>
        </a>
        <a class="slide" href="https://wikipedia.org">
          <img height="50" width="50" class="img-circle tags" src="https://images.unsplash.com/photo-1593642532400-2682810df593?ixid=MnwxMjA3fDF8MHxlZGl0b3JpYWwtZmVlZHwxfHx8ZW58MHx8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=60">
          <div class="sidekro">
            Grapes
          </div>
        </a>
        <a class="slide" href="https://wikipedia.org">
          <img height="50" width="50" class="img-circle tags" src="https://images.unsplash.com/photo-1593642532400-2682810df593?ixid=MnwxMjA3fDF8MHxlZGl0b3JpYWwtZmVlZHwxfHx8ZW58MHx8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=60">
          <div class="sidekro">
            Pomeogranate
          </div>
        </a>

      </ul>
      <i class="right-button"></i>
    </div>
  </div>
</div>





<div class="ibox bsh">
  <h4>Second</h4>
  <div class="projects-catalog">
    <div class="catalog-cover">
      <i class="left-button"></i>
      <ul class="sliderWrapper1">
        <a class="slide" href="https://wikipedia.org">
          <img height="50" width="50" class="img-circle tags" src="https://images.unsplash.com/photo-1593642532400-2682810df593?ixid=MnwxMjA3fDF8MHxlZGl0b3JpYWwtZmVlZHwxfHx8ZW58MHx8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=60">
          <div class="sidekro">
            January
          </div>
        </a>
        <a class="slide" href="https://wikipedia.org">
          <img height="50" width="50" class="img-circle tags" src="https://images.unsplash.com/photo-1593642532400-2682810df593?ixid=MnwxMjA3fDF8MHxlZGl0b3JpYWwtZmVlZHwxfHx8ZW58MHx8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=60">
          <div class="sidekro">
            February
          </div>
        </a>
        <a class="slide" href="https://wikipedia.org">
          <img height="50" width="50" class="img-circle tags" src="https://images.unsplash.com/photo-1593642532400-2682810df593?ixid=MnwxMjA3fDF8MHxlZGl0b3JpYWwtZmVlZHwxfHx8ZW58MHx8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=60">
          <div class="sidekro">
            March
          </div>
        </a>
        <a class="slide" href="https://wikipedia.org">
          <img height="50" width="50" class="img-circle tags" src="https://images.unsplash.com/photo-1593642532400-2682810df593?ixid=MnwxMjA3fDF8MHxlZGl0b3JpYWwtZmVlZHwxfHx8ZW58MHx8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=60">
          <div class="sidekro">
            April
          </div>
        </a>
        <a class="slide" href="https://wikipedia.org">
          <img height="50" width="50" class="img-circle tags" src="https://images.unsplash.com/photo-1593642532400-2682810df593?ixid=MnwxMjA3fDF8MHxlZGl0b3JpYWwtZmVlZHwxfHx8ZW58MHx8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=60">
          <div class="sidekro">
            May
          </div>
        </a>
        <a class="slide" href="https://wikipedia.org">
          <img height="50" width="50" class="img-circle tags" src="https://images.unsplash.com/photo-1593642532400-2682810df593?ixid=MnwxMjA3fDF8MHxlZGl0b3JpYWwtZmVlZHwxfHx8ZW58MHx8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=60">
          <div class="sidekro">
            June
          </div>
        </a>
        <a class="slide" href="https://wikipedia.org">
          <img height="50" width="50" class="img-circle tags" src="https://images.unsplash.com/photo-1593642532400-2682810df593?ixid=MnwxMjA3fDF8MHxlZGl0b3JpYWwtZmVlZHwxfHx8ZW58MHx8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=60">
          <div class="sidekro">
            June
          </div>
        </a>
        <a class="slide" href="https://wikipedia.org">
          <img height="50" width="50" class="img-circle tags" src="https://images.unsplash.com/photo-1593642532400-2682810df593?ixid=MnwxMjA3fDF8MHxlZGl0b3JpYWwtZmVlZHwxfHx8ZW58MHx8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=60">
          <div class="sidekro">
            June
          </div>
        </a>
        <a class="slide" href="https://wikipedia.org">
          <img height="50" width="50" class="img-circle tags" src="https://images.unsplash.com/photo-1593642532400-2682810df593?ixid=MnwxMjA3fDF8MHxlZGl0b3JpYWwtZmVlZHwxfHx8ZW58MHx8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=60">
          <div class="sidekro">
            June
          </div>
        </a>
        <a class="slide" href="https://wikipedia.org">
          <img height="50" width="50" class="img-circle tags" src="https://images.unsplash.com/photo-1593642532400-2682810df593?ixid=MnwxMjA3fDF8MHxlZGl0b3JpYWwtZmVlZHwxfHx8ZW58MHx8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=60">
          <div class="sidekro">
            June
          </div>
        </a>

        <a class="slide" href="https://wikipedia.org">
          <img height="50" width="50" class="img-circle tags" src="https://images.unsplash.com/photo-1593642532400-2682810df593?ixid=MnwxMjA3fDF8MHxlZGl0b3JpYWwtZmVlZHwxfHx8ZW58MHx8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=60">
          <div class="sidekro">
            July
          </div>
        </a>

        <a class="slide" href="https://wikipedia.org">
          <img height="50" width="50" class="img-circle tags" src="https://images.unsplash.com/photo-1593642532400-2682810df593?ixid=MnwxMjA3fDF8MHxlZGl0b3JpYWwtZmVlZHwxfHx8ZW58MHx8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=60">
          <div class="sidekro">
            August
          </div>
        </a>

        <a class="slide" href="https://wikipedia.org">
          <img height="50" width="50" class="img-circle tags" src="https://images.unsplash.com/photo-1593642532400-2682810df593?ixid=MnwxMjA3fDF8MHxlZGl0b3JpYWwtZmVlZHwxfHx8ZW58MHx8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=60">
          <div class="sidekro">
            September
          </div>
        </a>
        <a class="slide" href="https://wikipedia.org">
          <img height="50" width="50" class="img-circle tags" src="https://images.unsplash.com/photo-1593642532400-2682810df593?ixid=MnwxMjA3fDF8MHxlZGl0b3JpYWwtZmVlZHwxfHx8ZW58MHx8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=60">
          <div class="sidekro">
            September
          </div>
        </a>
        <a class="slide" href="https://wikipedia.org">
          <img height="50" width="50" class="img-circle tags" src="https://images.unsplash.com/photo-1593642532400-2682810df593?ixid=MnwxMjA3fDF8MHxlZGl0b3JpYWwtZmVlZHwxfHx8ZW58MHx8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=60">
          <div class="sidekro">
            September
          </div>
        </a>
        <a class="slide" href="https://wikipedia.org">
          <img height="50" width="50" class="img-circle tags" src="https://images.unsplash.com/photo-1593642532400-2682810df593?ixid=MnwxMjA3fDF8MHxlZGl0b3JpYWwtZmVlZHwxfHx8ZW58MHx8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=60">
          <div class="sidekro">
            September
          </div>
        </a>
        <a class="slide" href="https://wikipedia.org">
          <img height="50" width="50" class="img-circle tags" src="https://images.unsplash.com/photo-1593642532400-2682810df593?ixid=MnwxMjA3fDF8MHxlZGl0b3JpYWwtZmVlZHwxfHx8ZW58MHx8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=60">
          <div class="sidekro">
            September
          </div>
        </a>
        <a class="slide" href="https://wikipedia.org">
          <img height="50" width="50" class="img-circle tags" src="https://images.unsplash.com/photo-1593642532400-2682810df593?ixid=MnwxMjA3fDF8MHxlZGl0b3JpYWwtZmVlZHwxfHx8ZW58MHx8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=60">
          <div class="sidekro">
            September
          </div>
        </a>
        <a class="slide" href="https://wikipedia.org">
          <img height="50" width="50" class="img-circle tags" src="https://images.unsplash.com/photo-1593642532400-2682810df593?ixid=MnwxMjA3fDF8MHxlZGl0b3JpYWwtZmVlZHwxfHx8ZW58MHx8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=60">
          <div class="sidekro">
            September
          </div>
        </a>

      </ul>
      <i class="right-button"></i>
    </div>
  </div>
</div>

from Make Same JS work for different Divisions Elements