CODEWITHSUNDEEP
javascript
Smooth Neon
Smooth Neon

Reputation: 571

Cannot delete buttons using js

I can't delete two <button> tags using javascript. When you enter the wrong pin, I want the buttons to delete themselves but somehow it's not working.

var radar = document.getElementsByTagName("button");
var pin = 3778;
var pin_request = prompt("Podaj pin")
if (pin_request == pin) {
  document.write("Podany pin: " + pin_request);
  alert("Podano właściwy pin.");

} else {

  document.write("odmowa dostępu.");
  radar.parentNode.removeChild(radar);
}
<html>

<head>
  <meta charset="UTF-8">
  <style>
    html {
      text-align: center;
      padding: 7em;
      display: block;
    }
    
    button {
      margin: 1cm;
    }
  </style>
</head>

<body><br>
  <button>dodaj pieniądze</button>
  <button>zainwestuj w nieruchomości</button>
  <script src="do visual studio code.js"></script>
</body>

</html>

Also sorry for half-English code.

Upvotes: 2

Views: 102

Answers (4)

sample
sample

Reputation: 412

This should work

 var radar = document.getElementsByTagName("button");
var pin = 3778;
var pin_request = prompt("Podaj pin")
if (pin_request == pin)
{
    document.write("Podany pin: "+pin_request);
    alert("Podano właściwy pin.");
    
}
else {
    
   document.write("odmowa dostępu.");
   var elem = document.getElementById('btn1');
    elem.parentNode.removeChild(elem);
    var elem2 = document.getElementById('btn2');
    elem2.parentNode.removeChild(elem2);
}
<button id = 'btn1'>dodaj pieniądze</button>
    <button id = 'btn2'>zainwestuj w nieruchomości</button>

Upvotes: 0

urchmaney
urchmaney

Reputation: 618

<!DOCTYPE HTML5>
<html>
    <head>
        <meta charset="UTF-8">
        <style>
            html{text-align:center; padding:7em; display:block;}
            button{
                margin:1cm;
            }
        </style>
    </head>
    <body><br>
   <button>dodaj pieniądze</button>
    <button>zainwestuj w nieruchomości</button>
    <script>
      var radar = document.querySelectorAll("button");
var pin = 3778;
var pin_request = prompt("Podaj pin")
if (pin_request == pin)
{
    document.write("Podany pin: "+pin_request);
    alert("Podano właściwy pin.");
    
}
else {
    
   document.write("odmowa dostępu.");
    radar.forEach(ele =>{
      ele.remove(); 
    })
}

    </script>
</body>
</html>

Upvotes: 0

Cagri Tacyildiz
Cagri Tacyildiz

Reputation: 17610

You can use querySelectorAll to get elements and in loop remove them.

 var radar = document.querySelectorAll("button");
var pin = 3778;
var pin_request = prompt("Podaj pin")
if (pin_request == pin)
{
    document.write("Podany pin: "+pin_request);
    alert("Podano właściwy pin.");
    
}
else {
    
   document.write("odmowa dostępu.");
    radar.forEach(el=>{
       el.remove();
    })
}
<html>
    <head>
        <meta charset="UTF-8">
        <style>
            html{text-align:center; padding:7em; display:block;}
            button{
                margin:1cm;
            }
        </style>
    </head>
    <body><br>
   <button>dodaj pieniądze</button>
    <button>zainwestuj w nieruchomości</button>
    <script src="do visual studio code.js"></script>
</body>

Upvotes: 2

TobiWestside
TobiWestside

Reputation: 214

getElementyByTagName() returns an array of elements, but removeChild() only takes one element as an argument. If you use a loop it should work:

var parent = radar[0].parentNode
for(var i = 0; i < radar.length; i++) {
    parent.removeChild(radar[i])
}

Upvotes: 1

Related Questions