How TO - Toggle Hide and Show
Toggle between hiding and showing an element with JavaScript.
Click the button!
Toggle (Hide/Show) an Element
Step 1) Add HTML:
Example
<button onclick="myFunction()">Click Me</button>
<div id="myDIV">
This is my DIV element.
</div>
Step 2) Add JavaScript:
Example
function myFunction() {
var x = document.getElementById('myDIV');
if (x.style.display
=== 'none') {
x.style.display = 'block';
} else {
x.style.display =
'none';
}
}
Try it Yourself »