JSFiddle - React, Tailwind, and code Playground

HTML

<a href="javascript:unhide('text1');">Text 1</a> 
<a href="javascript:unhide('text2');">Text 2</a>
<a href="javascript:unhide('text3');">Text 3</a>
<div id="text1" class="unhidden"> 
    This will show up when the Text 1 link is pressed.
</div>
<div id="text2" class="hidden"> 
    This will show up when the Text 2 link is pressed.
</div>
<div id="text3" class="hidden">
    This will show up when the Text 3 link is pressed.
</div>

CSS

.hidden { display: none; }
.unhidden { display: block; }

JavaScript

var divs= new Array("text1", "text2", "text3");

function unhide(divID) {
    var item = document.getElementById(divID);
    if (item) {
        item.className='unhidden';
    }
    for (var i in divs){
        if (divs[i] != divID){
            item = document.getElementById(divs[i]);
            if (item) {
                item.className='hidden';
            }
         }
    }
}