sh

by Tan

HTML

<h2>Show/Hide</h2>

<div id="sh1">Show 1</div>
<div id="sh1_div" class="sh">I am 1</div>

<div id="sh2">Show 2</div>
<div id="sh2_div" class="sh">I am 2</div>

<div id="sh3">Show 3</div>
<div id="sh3_div" class="sh">I am 3</div>

CSS

.sh {display:none;background-color:#eeeeee;padding:5px;}

.open {display:block;}

JavaScript

function id(x) {var y = document.getElementById(x); return y;}

sh("sh1");
sh("sh2");
sh("sh3");

function sh(x) {
var x = id(x);  
var y = id(x.id + "_div")
x.addEventListener("click", (event) => {
if (y.className == "sh") {y.className = "sh open";}
else {y.className = "sh";}
});
}