Sometimes, we want to toggle display: none style with JavaScript.
In this article, we’ll look at how to toggle display: none style with JavaScript.
How to toggle display: none style with JavaScript?
To toggle display: none style with JavaScript, we set the style.display property.
For instance, we write
const yourUl = document.getElementById("yourUlId");
yourUl.style.display = yourUl.style.display === "none" ? "" : "none";
to select the element to modify with getElementById.
Then we set its style.display property to '' is it’s currently 'none'.
Otherwise, we set it to 'none'.
Conclusion
To toggle display: none style with JavaScript, we set the style.display property.
