JSFiddle - React, Tailwind, and code Playground

HTML

<p>Show page <span onclick="show('Page1');">1</span>, <span onclick="show('Page2');">2</span>, <span onclick="show('Page3');">3</span>.
</p>

<div id="Page1" class="page" style="">
    Content of page 1
</div>
<div id="Page2" class="page" style="display:none">
    Content of page 2
</div>
<div id="Page3" class="page" style="display:none">
    Content of page 3
</div>

CSS

span {
    text-decoration:underline;
    color:blue;
    cursor:pointer;
}

JavaScript

function show(elementID) {
    var ele = document.getElementById(elementID);
    if (!ele) {
        alert("no such element");
        return;
    }
    var pages = document.getElementsByClassName('page');
    for(var i = 0; i < pages.length; i++) {
        pages[i].style.display = 'none';
    }
    ele.style.display = 'block';
}