How to hide a DOM element using plain JavaScript
New Courses Coming Soon
Join the waiting lists
Find out how to hide and then show again elements in vanilla JavaScript
How do you hide a DOM element using plain JavaScript?
Every element exposes a style
property which you can use to alter the CSS styling properties.
You can set the display
property to ‘none’ (like you would do in CSS, display: none;
):
element.style.display = 'none'
To display it again, set it back to block
or inline
:
element.style.display = 'block'
→ Get my JavaScript Beginner's Handbook
→ Read my
JavaScript Tutorials
on The Valley of Code
→ Read my
TypeScript Tutorial
on The Valley of Code
Here is how can I help you:
- COURSES where I teach everything I know
- CODING BOOTCAMP cohort course - next edition in 2025
- BOOKS 16 coding ebooks you can download for free on JS Python C PHP and lots more
- Follow me on X