В проектах часто использую такую логику, когда при клике на кнопку к ней добавляю класс active, а у остальных пунктов меню удаляю. Я всегда это делал с помощью проверки if else

$('.item').on('click', function() {
  
  if($(this).hasClass('active')) {
     $(this).removeClass('active')
  } else {
     $(‘.item').removeClass('active')
     $(this).addClass('active')
  }

 })

При нажатии на кнопку я проверяю, если есть класс active, то удаляю его, а если нет, то добавляю к нему active и удаляю его у всех других элементов из списка.

Такой подход применяю обычно в аккардионах, к примеру, в блоке «Вопрос-Ответ».

GPT-4 подсказал вариант получше 👇

$('.item').on('click', function() {
    $(this).toggleClass('active')
         .siblings()
         .removeClass('active');
});

.toggleClass('active') — добавляет или удаляет класс active в зависимости есть он на элементе или нет.
.siblings().removeClass('active') — получаю все элементы на одном уровне вложенности с нажатым и удаляю у них класс active.

Использовал один раз, поэтому оставлю пока здесь, чтоб не забыть для следующего раза.

#code

👇 Место для огня