JSFiddle - React, Tailwind, and code Playground

HTML

<body>
          <center>
            <nobr>
              <button onclick="hs(1)"> Content div1 
              </button> &nbsp;&nbsp; 
              <button onclick="hs(2)"> Content div2 
              </button> &nbsp;&nbsp; 
              <button onclick="hs(3)"> Content div3 
              </button> &nbsp;&nbsp; 
              <button onclick="hs(4)"> Content div4 
              </button> &nbsp;&nbsp; 
              <button onclick="hs(5)"> Content div5 
              </button>
            </nobr>
          </center>
          <hr>
          <center>
            <nobr>
              <a href="#!" id="" onclick="return hs(1)"> Content div1 </a> | 
              <a href="#!" id="" onclick="return hs(2)"> Content div2 </a> | 
              <a href="#!" id="" onclick="return hs(3)"> Content div3 </a> | 
              <a href="#!" id="" onclick="return hs(4)"> Content div4 </a> | 
              <a href="#!" id="" onclick="return hs(5)"> Content div5 </a>
            </nobr>
          </center>
          <hr>
          <div id="div1" style="background-color:#ff00ff; display:block;">DIV element 1.  
          </div>
          <div id="div2" style="background-color:#ff0000;">DIV element 2. 
          </div>
          <div id="div3" style="background-color:#cccccc;">DIV element 3. 
          </div>
          <div id="div4" style="background-color:#ffff00;">DIV element 4. 
          </div>
          <div id="div5" style="background-color:#0000ff;">DIV element 5.

CSS

div { width:100%; height:100px; text-align: center; display: none; }

JavaScript

function hs(divno){
          for(var i = 1 ; i <=5 ; i++){
              var display = (i == divno) ? "block":"none";
              document.getElementById("div"+i).style.display = display;
          }
      }