Как добавлять видимость элементу при клике на блоке, и одновременно скрывать все остальные?

Question

[алексей]

<div class="menu">
   <div class="button1"></div>
   <div class="button2"></div>
   <div class="button3"></div>
</div>
<div class="text">
   <div class="block1"></div>
   <div class="block2"></div>
   <div class="block3"></div>
</div>

При клике на button1 элемент block1 должен становиться видимым, все остальные блоки скрываться. При клике на button2 видимым должен становиться block2, остальные соответственно скрываться. С третьим тоже самое.
Помогите пожалуйста с наиболее подходящим решением, до изучения JS ещё не добрался, а функция понадобилась.
На jQuery или на чистом js не имеет значения.

Answer 1

[supertrolyaso]

Вот: https://codepen.io/anon/pen/zjvRbZ