How TO — Toggle Hide and Show
Toggle between hiding and showing an element with JavaScript.
Toggle (Hide/Show) an Element
Step 1) Add HTML:
Example
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»;
>
>
Tip: For more information about Display and Visibility, read our CSS Display Tutorial.
COLOR PICKER
Report Error
If you want to report an error, or if you want to make a suggestion, do not hesitate to send us an e-mail:
Thank You For Helping Us!
Your message has been sent to W3Schools.
Top Tutorials
Top References
Top Examples
Get Certified
W3Schools is optimized for learning and training. Examples might be simplified to improve reading and learning. Tutorials, references, and examples are constantly reviewed to avoid errors, but we cannot warrant full correctness of all content. While using W3Schools, you agree to have read and accepted our terms of use, cookie and privacy policy.