JSFiddle - React, Tailwind, and code Playground

HTML

<div id="app-menu">
      <button name="b1">Кнопка 1</button>
      <button name="b2">Кнопка 2</button>
      <button name="b3">Кнопка 3</button>
      <button name="b4">Кнопка 4</button>
    </div>
    <div id="main">
      <div id="b1" class="main-el">
      Вкладка 1
      </div>
      <div id="b2" class="main-el">
        Вкладка 2
      </div>
      <div id="b3" class="main-el">
        Вкладка 3
      </div>
      <div id="b4" class="main-el">
        Вкладка 4
      </div>
    </div>

CSS

.main-el {
  display: none;
  justify-content: center;
}

JavaScript

let buttons = document.querySelectorAll('#app-menu button');

buttons.forEach(function(_, i) {
  this[i].addEventListener('click', function() {
    let elements = document.querySelectorAll('.main-el');
    for (let i = 0; i < elements.length; i++) {
      elements[i].style.display = 'none';
    }
    let element = document.querySelectorAll('#' + this.name);
    element[0].style.display = 'flex';
  }, false);
}, buttons);