-3

I want to hide div element and remove div on button clicked. I am new to javascript but worked on android. In android we are having feature of visibility:hidden or visibility:gone. how to implement it with javascript.

I just found document.getElementById("id").style.visibility="hidden";.

DjaouadNM
  • 22,013
  • 4
  • 33
  • 55

2 Answers2

1

You can use document.getElementById("myDIV").style.display = "none" to hide the div and document.getElementById("myDIV").style.display = "block" to show it

w3Schools has a greate guide on this

function myFunction() {
  var x = document.getElementById("myDIV"); //so we dont have to write doc.get multiple times
  if (x.style.display === "none") { //check if hidden
    x.style.display = "block"; //display it
  } else {
    x.style.display = "none"; //hide it
  }
}
#myDIV {
  width: 100%;
  padding: 50px 0;
  text-align: center;
  background-color: lightblue;
  margin-top: 20px;
}
<button onclick="myFunction()">Try it</button>

<div id="myDIV">
  This is my DIV element.
</div>
PEPEGA
  • 2,214
  • 20
  • 37
  • whatever he have done that will also work. `document.getElementById("id").style.visibility="hidden";` – Kaushik Aug 30 '19 at 10:17
  • @Kaushik Yes but the looks of it he only needs to understand how to implement it, so he can try it himself – PEPEGA Aug 30 '19 at 10:18
0
HTML
<button onclick="myFunction()">Click Me</button>
<div id="myDIV"> TEST </div>

JS
function myFunction() {
var z = document.getElementById("myDIV");
if (z.style.display === "none") {z.style.display === "block"; }
else {z.style.display = "none" }}