Learn to Code via Tutorials on Repl.it!

← Back to all posts
How to Show/Hide Elements in Javascript with HTML

How to Show/Hide Elements in Javascript with HTML!
Type 1 - Do Only one condition on a time:
Lets Learn!

Use this code

By Clicking
<button onclick="document.getElementById('element').style.display='none'">Here</button

<p id="element"> This text may be hidded</p>
  1. In button Element we used onclick to run a js code when the button is clicked!
  2. If we want to show the element we reload the site or use the following given code!
    <button onclick="document.getElementById('element').style.display='block'">Here</button<p id="element"> If this text is already hidded so it will show again!</p>

Type 2 - Do Multiple conditions on a time:

Use this code:
<button onclick="document.getElementById('h2').style.display = 'none';document.getElementById('show').style.display='block';document.getElementById('hide').style.display='none';">Button</button>

If you want to see source code So Visit - https://Show-hide-elements.codingrequire.repl.co

Thank you, Friends =D


why must you minify the html