Как в скрипте реализовать подсветку активного пункта меню?

$('.sliders_product li').click(
  function() {
    event.preventDefault()
    
    $('.sliders_product .active').removeClass("active");
    $(this).addClass('active');
    
    var mySlider = $(this).data("slider");
    $('.slider_product').not('.' + mySlider).removeClass('show');
    $('.' + mySlider).addClass('show');
  }
);

.slider_product {
  display: none;
}

.show {
  display: block;
}

.active{
  color: red;
}

.active a{
  color: inherit;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<ul class="sliders_product">
  <li data-slider="slider_hit" class="active"><a href="#">Хит продаж</a></li>
  <li data-slider="slider_new"><a href="#">Новинки</a></li>
  <li data-slider="slider_sovet"><a href="#">Советуем</a></li>
  <li data-slider="slider_sale"><a href="#">Акции</a></li>
</ul>

<div class="slider_product show slider_hit">Слайдер хит</div>
<div class="slider_product slider_new">Слайдер новинки</div>
<div class="slider_product slider_sovet">Слайдер советуем</div>
<div class="slider_product slider_sale">Слайдер акции</div>