<div id="slide">
<div class="slide_item slide_1">
<div class="slide_bg"></div>
<img class="slide_img" src="assets/img/slide_1.jpg"/>
</div>
<div class="slide_item slide_2">
<div class="slide_bg"></div>
<img class="slide_img" src="assets/img/slide_2.jpg"/>
</div>
<div class="slide_control">
<div class="prev"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 36">
<path id="Shape_20114_20copy_203" d="M20,18.084,2.794,36,0,33.07,14.473,18,0,2.93,2.794,0,20,17.917,19.92,18Z" opacity="0.4"/>
</svg>
</div>
<div class="next"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 36">
<path id="Shape_20114_20copy_203" d="M20,18.084,2.794,36,0,33.07,14.473,18,0,2.93,2.794,0,20,17.917,19.92,18Z" opacity="0.4"/>
</svg>
</div>
</div>
</div>
<script>
$(document).ready(function() {
const Slide1 = $('.slide_1');
const Slide2 = $('.slide_2');
const Up = $('.sli_up');
const Down = $('.sli_d');
const Next = $('.next');
const Next2 = $('.next_a');
Next.click(function(){
Slide1.addClass('sli_up');
Slide2.addClass('sli_d');
Next.removeClass('next');
Next.addClass('next_a');
});
Next2.click(function(){
Slide1.removeClass('sli_up');
Slide2.removeClass('sli_d');
Slide1.addClass('sli_d');
Slide2.addClass('sli_up');
Next2.addClass('next');
});
});
Надо чтобы при клике на div с классом "next" ему присваивался класс "next_a", а "next" удалялся. И соответственно при клике на "next_a" присваивался класс "next", а "next_a" удалялся.
1 действие происходит отлично, но вот "next_a" не реагирует на клик никак.