<div>
  <span>choose one:</span>
  <button class="buttonA">A</button>
  <button class="buttonB">B</button>
</div>
<div id="A" class="box">Name: A</div>
<div id="B" class="box">Name: B</div>

var buttonA = document.querySelector('.buttonA');
var buttonB = document.querySelector('.buttonB');

function show(elementIdName) {
  var element = document.getElementById(elementIdName);
  element.style.visibility = 'visible';
}
function hide(elementIdName) {
  var element = document.getElementById(elementIdName);
  element.style.visibility = 'hidden';
}

buttonA.addEventListener('click', function() {
  show('A');
  hide('B');
});
buttonB.addEventListener('click', function() {
  show('B');
  hide('A');
});