Remove the object's sibling on click
You should define one click handler that removes all siblings of the clicked element.  That is, remove all children of the parent, except the target of the event itself.



document.getElementById('game1').addEventListener('click', function(event) {
    // Remove all siblings of the clicked element
    for (var c = this.childNodes.length - 1; c &gt;= 0; c--) {
        if (this.childNodes[c] != event.target) {
            this.removeChild(this.childNodes[c]);
        }
    }
});
&lt;div id="game1"&gt;
  &lt;button&gt;Alpha&lt;/button&gt;
  &lt;button&gt;Bravo&lt;/button&gt;
  &lt;button&gt;Charlie&lt;/button&gt;
  &lt;button&gt;Delta&lt;/button&gt;
&lt;/div&gt;




You could also iterate this way, but there's an awkward c--:

for (var c = 0; c &lt; this.childNodes.length; c++) {
    if (this.childNodes[c] != event.target) {
        this.removeChild(this.childNodes[c--]);
    }
}