Show or hide an element

 

How to show or hide an element:

In order to show or hide an element, manipulate the element's style property. In most cases, you probably just want to change the element's display property:

element.style.display = 'none';               // Hide
element.style.display = 'block';              // Show
element.style.display = 'inline';             // Show
element.style.display = 'inline-block';   // Show

 

 

Alternatively, if you would still like the element to occupy space (like if you were to hide a table cell), you could change the element's visibility property instead:

element.style.visibility = 'hidden';      // Hide
element.style.visibility = 'visible';     // Show