1

I have menu structure like below,

    <ul class="sub-menu">
    <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-34" id="menu-item-34"><a href="http://localhost/artofsujata/testimonials/">
<span class="menu_left">&nbsp;</span> 
<span class="menu_center">Testimonials</span> 
<span class="menu_right">&nbsp;</span>
</a>
</li>   
</ul>

i need to remove the tags without lossing data and i need above menu structrue like below,

    <ul class="sub-menu">
    <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-34" id="menu-item-34"><a href="http://localhost/artofsujata/testimonials/">
&nbsp; 
Testimonials
&nbsp;
</a>
</li>   
</ul>

how can i do this using jquery?..

  • Possible duplicate: http://stackoverflow.com/questions/2308366/remove-element-with-jquery-but-leave-text (jsFiddle showing this approach with this question [here](http://jsfiddle.net/gothick/uzDSa/).) – Matt Gibson Aug 24 '11 at 10:41

3 Answers3

5

As noted in this earlier question, this should do the trick:

$("span").contents().unwrap();

jsFiddle here.

Obviously you might want to target this more precisely at your menu to avoid removing other spans on the page:

$(".sub-menu li span").contents().unwrap();

On the other hand, I'd suggest it might be easier just to change the style of the span in CSS, depending on what your actual problem is.

Community
  • 1
  • 1
Matt Gibson
  • 37,886
  • 9
  • 99
  • 128
  • Nice answer, i didn't know you could use unwrap() on the text nodes. "I think I've learned something today" (c)Stan :) – Ivan Aug 24 '11 at 10:59
2

This will do the trick:

$('ul li a').html($('ul li a').text());

With $('ul li a').text() you select all text nodes in your tag. And with $('ul li a').html() you put all selected text nodes in your tag. This results in stripping all tags from there.

For multiple LIs you can use this:

$('ul.sub-menu > li.menu-item > a').each(function(){
  $(this).html($(this).text());
});
Ivan
  • 3,567
  • 17
  • 25
  • +1. very good. but please use this for multiple lis `$('ul li a').each(function() {$(this).html($(this).text());});` – naveen Aug 24 '11 at 10:50
  • @naveen fair comment, i'll add your bit to the answer if you don't mind. – Ivan Aug 24 '11 at 10:52
0

Read all the tags, store the data in an array in JS, remove all the tags, and then rewrite the data back out in the format you need?

Brian Mains
  • 50,520
  • 35
  • 148
  • 257