示例排序两个div

I have two div's A and B, I looking example to switch between them without reloading a page, for example onclick a first button show only div A, second button show only Div B, and third button show all A and B div's

<div id="A" style="dispay:none">
  <p> this is div 1 </p>
</div>
<div id="B" style="dispay:none">
  <p> this is div 2 </p>
</div>
<input type="button" value="showA" onclick="showA()">
<input type="button" value="showA" onclick="showB()">
<input type="button" value="showA" onclick="showAB()">
<script>
  var showA = function()
  {
   document.getElementById('A').style.display = 'block';
   document.getElementById('B').style.display = 'none'; 
  }
  var showB = function()
  {
   document.getElementById('B').style.display = 'block';
   document.getElementById('A').style.display = 'none'; 
  }
  var showAB = function()
  {
   document.getElementById('A').style.display = 'block';
   document.getElementById('B').style.display = 'block'; 
  }
</script>