Получаем коллекцию всех элементов с необходимым классом:
const buttons = document.querySelectorAll('.my-button');
Добавляем обработчик события клика для каждой кнопки:
buttons.forEach((button) => {
button.addEventListener('click', () => {
// Ваш код здесь
});
});
В обработчике события клика удаляем класс active у всех кнопок, кроме нажатой:
buttons.forEach((button) => {
button.addEventListener('click', () => {
buttons.forEach((btn) => {
if (btn !== button) {
btn.classList.remove('active');
}
});
button.classList.add('active');
});
});
Здесь мы проходимся циклом по всем кнопкам и удаляем класс active, если кнопка не равна нажатой. Затем добавляем класс active к нажатой кнопке.