title: Can a button delete itself via a function? Javascript
body: <p>I am creating a reset button, that when clicked should delete itself via a function.  </p>
  
  <p>But the deletion works only when fired by any element other than the button itself :(  I mean the onclick doesn't work right.</p>
  
  <p>function to create the reset button:</p>
  
  <pre><code>function createButton(context, id , value ,func)
  {
    var button = document.createElement("input");
    button.type = "button";
    button.id = id;
    button.value = value; // text on button
    button.onclick = func;
    context.appendChild(button); // add the button to the context
  }
  </code></pre>
  
  <p>the call to the create function:<br>
  <code>createButton(document.body , "resetButton" , "Reset Game" ,  "resetGame();" );</code>  </p>
  
  <p>the reset function which suppose to delete the button:  </p>
  
  <pre><code>//reminder - id is "resetButton"
  function resetGame()
  {   
    var resetBottun = document.getElementById("resetButton");
    var parentOfResetButton = resetBottun.parentElement;
    parentOfResetButton.removeChild(resetBottun);
  };  
  </code></pre>
  
  <p>when I click the button , it should fire the resetGame() function and the button should disappear, but as I mentioned that only happens if I run the resetGame() function from any other place but not the onclick of the reset button.  </p>
  
  <p>hope you understand :/  </p>
  
  <p>please help</p>