Юрий Матрос

class MyClass {
  constructor() {
    this.buttons = document.querySelectorAll('.btn');
    this.onClick = this.onClick.bind(this);
  }

  onChange(callback) {
    this.callback = callback;
    this.buttons.forEach((button) => {
      button.addEventListener('click', this.onClick);
    });
  }

  onClick(event) {
    const buttonText = event.target.textContent;
    this.callback(buttonText);
  }
}

const myInstance = new MyClass();

myInstance.onChange((text) => {
  alert(`Выбрана кнопка: ${text}`);
});

// получаем массив всех вкладок
const tabs = document.querySelectorAll(".tab");
// получаем массив всех блоков с содержимым вкладок
const contents = document.querySelectorAll(".content");

// запускаем цикл для каждой вкладки и добавляем на неё событие
for (let i = 0; i < tabs.length; i++) {
  tabs[i].addEventListener("click", (event) => {

    // сначала нам нужно удалить активный класс именно с вкладок
    let tabsChildren = event.target.parentElement.children;
    for (let t = 0; t < tabsChildren.length; t++) {
      tabsChildren[t].classList.remove("tab--active");
    }
    // добавляем активный класс
    tabs[i].classList.add("tab--active");
    // теперь нужно удалить активный класс с блоков содержимого вкладок
    for (let c = 0; c < contents.length; c++) {
      contents[c].classList.remove("content--active");
    }
    // добавляем активный класс
    contents[i].classList.add("content--active");

  });
}