Jquery removing string but keeping structure

Question

I'm piggy backing off of a previous post that talks specifically about removing a string from inside an element. The code to do that is:

  $this.text( $this.text().replace("text to strip out", "") );

I've successfully stripped out the text "categories: "

FYI: This is a blog page with categories that are dynamically added. HTML structure before I strip out "categories: ":

<container>
   <div class="categories">
     "categories: "  //This is what I strip out with above code
     <a href = "...">Category Name</a> //This is a linked category name
   </div>
</container>

The problem is that when I remove "categories: " it is also stripping out the and leaving me with an unlinked "Category Name"

After the jquery runs html looks like this:

 <container>
   <div class="categories">Category Name</div>
</container>

I need to keep the link active, as I want the ability for the user to click "Category Name" to stay.

Does the code you use for the replace include anything about the link? — danny slade
– danny slade, Commented Feb 7, 2013 at 17:06

Rory McCrossan · Accepted Answer · 2013-02-07 17:11:22Z

0

To remove a textNode you need to use contents() to retrieve them, then a combination of filter() and remove(), like this:

$('.categories')
    .contents()
    .filter(function() { return this.nodeType == 3; })
    .remove();

Example fiddle

Note this will remove all direct child textNodes. If you want to filter by the text of the node, amend the filter() function accordingly.

answered Feb 7, 2013 at 17:11

Rory McCrossan

338k41 gold badges322 silver badges353 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Leeish · Accepted Answer · 2013-02-07 17:00:42Z

0

One way to do it, don't know if it's the best way, is to save the anchor element as a javascript variable. Then after you remove the stuff you want to remove, inject that anchor back in.

answered Feb 7, 2013 at 17:00

Leeish

5,2132 gold badges20 silver badges48 bronze badges

Comments

Reinstate Monica Cellio · Accepted Answer · 2013-02-07 17:11:19Z

0

Try this instead...

$("div.categories").each(function() {
    var $this = $(this);
    $this.html($this.html().replace("categories: ", ""));
});

answered Feb 7, 2013 at 17:11

Reinstate Monica Cellio

26.2k6 gold badges54 silver badges67 bronze badges

Collectives™ on Stack Overflow

Jquery removing string but keeping structure

3 Answers 3

Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related