Remove anchor tags using jQuery
Try this:
To remove a
but retain its text try:
$('.example').html($('.example a#link').text());
or
$('.example a#link').replaceWith($('.example a#link').text());
.contents()
gets the children including text nodes.
.unwrap()
removes parent element while keeping the selected nodes.
These functions have been available since jQuery 1.4 which was released in 2010:
$('#link').contents().unwrap();
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.0/jquery.min.js"></script>
<div class="example">
<a id="link" href="http://www.google.com">Example</a>
</div>
It'll also work if you have multiple nodes in your selection:
$('a').contents().unwrap();
.one {
color: red;
}
.two {
color: green;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.0/jquery.min.js"></script>
<div class="one">
<a href="#">Foo</a>
</div>
<div class="two">
<a href="#">Bar</a>
</div>
Alternate solution:
$("a#link").replaceWith($("a#link").text());