StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PO
text
Body
copied!<p>Try this:</p> <pre><code><div id="apDiv2"> <a href="#" onclick="this.removeChild(this.firstChild)"><div id="apDiv1">T</div></a> </div> </code></pre> <ul> <li><p><a href="https://developer.mozilla.org/en-US/docs/Web/API/Node.removeChild" rel="nofollow"><code>removeChild()</code></a> only removes a direct child.</p></li> <li><p>I also made the code a bit cleaner:</p> <ul> <li><code>this</code> references the event's tag itself (in this case the <code><a></code> tag)</li> <li><code>this.firstChild</code> points to the first child of the link tag: the <code><div id="apDiv1"></code></li> </ul></li> </ul> <p>By the way, please take a look in the developer console of your browser (e.g. <code>F12</code> in Chrome) the next time. You would have seen an eror which you could post here. It will help people helping you ;)</p> <hr /> <p>An even better way would be to put the JavaScript in its own file (or at least in a <em></em> block) and to use the IDs for referencing the elements.</p> <p>I'd give the link another ID, say for example <code>myLink</code>:</p> <pre><code>document.getElementById("myLink").addEventListener("click", function () { this.removeChild(this.firstChild); }); </code></pre> <p>In case you cannot specify an ID for the link tag, there are multiple ways for using the outer <em>apDiv2 </em> as a reference point, e.g.:</p> <pre><code>var linkTag = document.querySelector("#apDiv2 a"); // or var linkTag = document.getElementById("apDiv2").getElementsByTagName("a")[0]; </code></pre>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload