JSFiddle - React, Tailwind, and code Playground

HTML

<ul class="kds">
  <li>tile dtls1</li>
  <li>tile dtls2</li>
  <li>tile dtls3</li>
  <li>tile dtls4</li>
  <li>tile dtls5</li>
  <li>tile dtls6</li>
  <li>tile dtls3</li>
  <li>tile dtls4</li>
  <li>tile dtls5</li>
  <li>tile dtls6</li>
  <li>tile dtls1</li>
  <li>tile dtls2</li>
  <li>tile dtls3</li>
  <li>tile dtls4</li>
  <li>tile dtls5</li>
  <li>tile dtls6</li>
  <li>tile dtls3</li>
  <li>tile dtls4</li>
  <li>tile dtls5</li>
  <li>tile dtls6</li>
</ul>
<input type="button" value="previous" class="previous">
<input type="button" value="next" class="next">

CSS

.kds {
    list-style-type: none;
    height: 100px;
    overflow-y: scroll;
}

.kds li {
  padding: 5px;
  border: 1px solid gray;
  margin: 1px;
  position:relative;
  height:20px;
}

.currentSelection {
  background-color: gray;
}

JavaScript

$(document).ready(function() {

  $('.previous').click(function() {
    var current = $('.currentSelection');
    if( current.index() != 0 && !current.is(":animated") ){
      currentTop = parseInt(current.css("top").replace("px",""));
      current.animate({top:currentTop - 33 })
      current.prev().animate({top:currentTop + 33},function(){
          current.css("top",0).prev().css("top",0);
          current.prev().before(current);
      });      
      $(".kds").animate({scrollTop: ($(".currentSelection").index()-2) * $(".currentSelection").outerHeight()});
    }
  });
  
  $('.next').click(function() {
    var current = $('.currentSelection');
    if( current.index() != ( $(".kds li").length-1)  && !current.is(":animated") ){
      currentTop = parseInt(current.css("top").replace("px",""));
      current.animate({top:currentTop + 33 })
      current.next().animate({top:currentTop - 33},function(){
          current.css("top",0).next().css("top",0);
          current.next().after(current);
      });
      $(".kds").animate({scrollTop: ($(".currentSelection").index()) * $(".currentSelection").outerHeight()});
    }
  });
  
  $(".kds li").on("click", function() {
  	$(this).css("top","0px");
    $(".kds li").removeClass("currentSelection");
    $(this).addClass("currentSelection");
  });  

});