Tell me how to implement so that at an event in the draggable slider the active class was added to the necessary work-links block, the active ones were deleted, so that it was not like a crutch, but at any slider change, the corresponding blocks were also changed, tinted in yellow
$('.our-work-slider').slick({ infinite: true, arrows: true, draggable: true, fade: true }); $('.work-link-item').click(function() { $('.work-link-item').removeClass('active'); $(this).addClass('active'); $('.our-work-slider').slick('slickGoTo', $(this).index()); }); <div class="how-we-work-wrapper"> <div class="page-container"> <div class="how-we-work-header"> <div class="how-we-work-left"> <div class="we-work-title"> Как мы работаем? </div> <div class="we-work-subtitle"> За годы работы мы выработали оптимальный<br> вариант сотрудничества с заказчиком. </div> </div> <div class="how-we-work-right"> <div class="small-btn modal-open order-link"> Узнать подробнее об оплате </div> </div> </div> <div class="we-work-container-dots"> <div class="work-links justify-wrap"> <div class="work-link-item active" aria-controls="slick-slide00"> <a href="javascript:void(0)"> Оплата </a> </div> <div class="work-link-item" aria-controls="slick-slide00"> <a href="javascript:void(0)"> Анализ </a> </div> <div class="work-link-item" aria-controls="slick-slide01"> <a href="javascript:void(0)"> Стратегия </a> </div> <div class="work-link-item" aria-controls="slick-slide02"> <a href="javascript:void(0)"> Разработка </a> </div> <div class="work-link-item" aria-controls="slick-slide03"> <a href="javascript:void(0)"> Реклама </a> </div> <span class="empty-span"></span> </div> </div> <div class="our-work-slider"> <div class="item"> <div class="our-work-row-item"> <div class="our-work-row__left"> <div class="our-work-row__content"> <div class="our-work-content__title"> У нас есть два варианта сотрудничества1 </div> <div class="our-work-content__text"> <p> <span>А —</span> Мы работаем с Вами по классической схеме 30% предоплата до начала работ - 70% пост-оплата после утверждения дизайн-макета. </p> <p> <span>Б —</span> Вы получаете индивидуальную скидку при полной предоплате. </p> </div> </div> </div> <div class="our-work-row__right"> <img src="images/w-1.jpg" alt=""> </div> </div> </div> <div class="item"> <div class="our-work-row-item"> <div class="our-work-row__left"> <div class="our-work-row__content"> <div class="our-work-content__title"> У нас есть два варианта сотрудничества2 </div> <div class="our-work-content__text"> <p> <span>А —</span> Мы работаем с Вами по классической схеме 30% предоплата до начала работ - 70% пост-оплата после утверждения дизайн-макета. </p> <p> <span>Б —</span> Вы получаете индивидуальную скидку при полной предоплате. </p> </div> </div> </div> <div class="our-work-row__right"> <img src="images/w-1.jpg" alt=""> </div> </div> </div> <div class="item"> <div class="our-work-row-item"> <div class="our-work-row__left"> <div class="our-work-row__content"> <div class="our-work-content__title"> У нас есть два варианта сотрудничества3 </div> <div class="our-work-content__text"> <p> <span>А —</span> Мы работаем с Вами по классической схеме 30% предоплата до начала работ - 70% пост-оплата после утверждения дизайн-макета. </p> <p> <span>Б —</span> Вы получаете индивидуальную скидку при полной предоплате. </p> </div> </div> </div> <div class="our-work-row__right"> <img src="images/w-1.jpg" alt=""> </div> </div> </div> <div class="item"> <div class="our-work-row-item"> <div class="our-work-row__left"> <div class="our-work-row__content"> <div class="our-work-content__title"> У нас есть два варианта сотрудничества4 </div> <div class="our-work-content__text"> <p> <span>А —</span> Мы работаем с Вами по классической схеме 30% предоплата до начала работ - 70% пост-оплата после утверждения дизайн-макета. </p> <p> <span>Б —</span> Вы получаете индивидуальную скидку при полной предоплате. </p> </div> </div> </div> <div class="our-work-row__right"> <img src="images/w-1.jpg" alt=""> </div> </div> </div> <div class="item"> <div class="our-work-row-item"> <div class="our-work-row__left"> <div class="our-work-row__content"> <div class="our-work-content__title"> У нас есть два варианта сотрудничества5 </div> <div class="our-work-content__text"> <p> <span>А —</span> Мы работаем с Вами по классической схеме 30% предоплата до начала работ - 70% пост-оплата после утверждения дизайн-макета. </p> <p> <span>Б —</span> Вы получаете индивидуальную скидку при полной предоплате. </p> </div> </div> </div> <div class="our-work-row__right"> <img src="images/w-1.jpg" alt=""> </div> </div> </div> </div> </div> 
