Using jQuery, how can I remove an anchor tag in my html body which also consists of a wrapper div, and this wrapper div is above the anchor tag that I want to remove.
It is like
<body> <div id="wrapper"> <a id="not_me" href="#">hi</a> </div> <a id="remove_me" href="#">Remove Me</a> </body>
If I use
$("body").find("a:first-child").remove();
it removes the first anchor tag in my wrapper div i.e. one with id "not_me", while I want "remove_me" to be removed.
jQuery empty() Method The empty() method removes all child nodes and content from the selected elements. Note: This method does not remove the element itself, or its attributes. Tip: To remove the elements without removing data and events, use the detach() method.
The remove() method removes the selected elements, including all text and child nodes. This method also removes data and events of the selected elements. Tip: To remove the elements without removing data and events, use the detach() method instead.
$("body").children("a:first").remove();
You use children()
(docs) because you only want to target direct children of body
.
Then use "a:first"
as the selector to target the first <a>
element.
This is because with the first-child-selector
(docs) you'll only get the <a>
if it is the first child of its parent (which it isn't). But with the first-selector
(docs) you get the first <a>
that was matched.
Alternative would be to place it all in one selector:
$('body > a:first').remove();
Same as above, but uses the >
child-selector
(docs) instead of the children()
(docs) method.
You want to use children()
to search on direct children only, and you can use :first
or eq(0)
to remove the first one:
$("body").children("a").eq(0).remove();
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With