javascript show hide div onclick toggle – How to show and hide div by a button click?

javascript show hide div onclick toggle – Simple demo with Toggle (Show Hide) DIV on Button Click using JavaScript and jQuery Example.

javascript show hide div onclick toggle

you can use the .toggle() method to toggle an element, any element.

HTML Code

  
This is the Primary div
  
This is the mainPart div
  
This is the uniqTds div
  Hide uniqTds div

javascript Code

const selectBasePart = document.getElementById("uniqTds");
const btn = document.getElementById("toggle");
btn.onclick = function () {
  if (selectBasePart.style.display !== "none") {
    selectBasePart.style.display = "none";
  } else {
    selectBasePart.style.display = "block";
  }
};

how to show hide div in html javascript?

index.html

Click the "Try it" button to toggle between hiding and showing the DIV element:

Try it


This is my DIV element.


Note: The element will not take up any space when the display property set to "none".

Don’t Miss : onclick show hide div jquery demo

I hope you get an idea about javascript show hide div onclick toggle.
I would like to have feedback on my infinityknow.com.
Your valuable feedback, question, or comments about this article are always welcome.
If you enjoyed and liked this post, don’t forget to share.