Конфликт слайдера

Slider(); 
 
function Slider() { 
  $('.slider-block').each(function() { 
    $(this).find('.slider-item').eq(0).addClass('slider-active'); 
  }); 
 
  $('.slider-block .slider-button').on('click', function() { 
    var sliderParent = $(this).closest('.slider-block'), 
      buttonPrev = $(this).hasClass('slider-prev'), 
      buttonNext = $(this).hasClass('slider-next'), 
      slideBlock = sliderParent.find('.slider-item'), 
      slideActive = sliderParent.find('.slider-active'), 
      slideLen = slideBlock.length, 
      slideActiveIndex = slideActive.index(), 
      slidePrev = (slideActiveIndex - 1), 
      slideNext = (slideActiveIndex + 1); 
    slideBlock.removeClass('slider-active'); 
 
    if (buttonPrev) { 
      slideBlock.eq(slidePrev).addClass('slider-active'); 
    } 
 
    if (buttonNext) { 
      if (slideNext == slideLen) var slideNext = 0; 
      slideBlock.eq(slideNext).addClass('slider-active'); 
    } 
    var sliderLenThis = sliderParent.find('.slider-active').index(); 
    sliderParent.find('.slider-len-this').text(sliderLenThis + 1); 
  }); 
}

.slider-block { 
  display: block; 
  width: 100%; 
} 
 
.slider-block .slider-head { 
  display: block; 
  width: 100%; 
  height: 30px; 
  margin-bottom: 10px; 
  color: #8e9aa9; 
} 
 
.slider-block .slider-head .slider-len, 
.slider-block .slider-head .slider-button { 
  display: inline-block; 
  float: left; 
  height: 30px; 
} 
 
.slider-block .slider-head .slider-len { 
  width: calc(100% - 70px); 
  line-height: 30px; 
  text-align: right; 
} 
 
.slider-block .slider-head .slider-button { 
  width: 30px; 
  border-radius: 2px; 
  margin-left: 5px; 
  position: relative; 
  cursor: pointer; 
} 
 
.slider-block .slider-head .slider-button i { 
  display: block; 
  width: 20px; 
  height: 20px; 
  font-size: 20px; 
  text-align: center; 
  line-height: 20px; 
  margin: auto; 
} 
 
.slider-block .slider-head .slider-button:hover { 
  color: #fff; 
  background-color: #8e9aa9; 
} 
 
.slider-block .slider-content { 
  display: block; 
  width: 100%; 
  overflow: hidden; 
  position: relative; 
} 
 
.slider-block .slider-content-wrap { 
  display: block; 
  width: 100%; 
} 
 
.slider-block .slider-content-wrap .slider-item { 
  display: none; 
  width: 100%; 
} 
 
.slider-block .slider-content-wrap .slider-item.slider-active { 
  display: block; 
} 
 
.slider-block .slider-content-wrap .slider-item img { 
  display: block; 
  max-width: 100%; 
  max-height: 100%; 
  object-fit: cover; 
  margin: 0 auto; 
} 
 
.slider-block .slider-head .slider-button i { 
  position: absolute; 
  left: 0; 
  top: 0; 
  right: 0; 
  bottom: 0; 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
 
<div class="slider-block"> 
  <div class="slider-head"> 
    <div class="slider-len o-ns"> 
      <span class="slider-len-this">1</span> 
      <span>/</span> 
      <span class="slider-len-max">4</span> 
    </div> 
    <div class="slider-button slider-prev o-ns o-am"> 
      <i class="fas fa-angle-left">&#9668;</i> 
    </div> 
    <div class="slider-button slider-next o-ns o-am"> 
      <i class="fas fa-angle-right">&#9658;</i> 
    </div> 
  </div> 
  <div class="slider-content"> 
    <div class="slider-content-wrap"> 
      <div class="slider-item"> 
        <img src="https://via.placeholder.com/350x150?text=Slide 1" /> 
      </div> 
      <div class="slider-item"> 
        <img src="https://via.placeholder.com/350x150?text=Slide 2" /> 
      </div> 
      <div class="slider-item"> 
        <img src="https://via.placeholder.com/350x150?text=Slide 3" /> 
      </div> 
      <div class="slider-item"> 
        <img src="https://via.placeholder.com/350x150?text=Slide 4" /> 
      </div> 
    </div> 
  </div> 
</div>