JSFiddle - React, Tailwind, and code Playground

by Gabriele Petrioli

HTML

<a href="javascript:void(null)" onclick="showhide('features');">features</a>
<a href="javascript:void(null)" onclick="showhide('design');">design</a>
<a href="javascript:void(null)" onclick="showhide('create');">create</a>

<div id="content">
    <div id="features">Features !!</div>
    <div id="design">Design !!</div>
    <div id="create">Create !!</div>
</div>

CSS

#content > div {display:none;}

JavaScript

var divState = {};
function showhide(id) {
    if (document.getElementById) {
        var divid = document.getElementById(id);
        divState[id] = (divState[id]) ? false : true;
        //close others
        for (var div in divState){
            if (divState[div] && div != id){
                document.getElementById(div).style.display = 'none';
                divState[div] = false;
            }
        }
        divid.style.display = (divid.style.display == 'block' ? 'none' : 'block');
    }
}