CODEWITHSUNDEEP
jqueryhtmldrupal
james6848
james6848

Reputation: 1667

Change an element's text without affecting sibling tags (jQuery)

I'm trying to modify this bit of HTML with jQuery to delete the duplicate arrow:

<div class="breadcrumb">
<a href="/spa/">Home</a> »  » <a href="/spa/image/tid">Image galleries</a>
</div>

I'm not having much luck, however, in that replacing the string using the replace() function seems to strip the HTML tags as well, leaving:

<div class="breadcrumb">Home » Image galleries</div>

My existing dodgy code is: 

$('.breadcrumb').each(function() { 
    var mytext = $(this); 
    var mytext2 = mytext.text(); 
    mytext.text(mytext2.replace(' » » ',' » ')); 
});

Any ideas?

Cheers, James

Upvotes: 2

Views: 524

Answers (2)

Andy E
Andy E

Reputation: 344517

It sounds like you're modifying the code using innerText or jQuery's .text(). When using these, HTML is stripped out and only the text is returned. Use .innerHTML or .html() instead.

Using your "dodgy" code:

$('.breadcrumb').each(function() {  
    var mytext = $(this);  
    var mytext2 = mytext.html();  
    mytext.html(mytext2.replace(' » » ',' » '));  
});

Upvotes: 2

Nikit
Nikit

Reputation: 5128

You can remove arrow via these in template.php of your theme: http://api.drupal.org/api/function/theme_breadcrumb/6 as YOURTHEME_breadcrumb function.

Upvotes: 2

Related Questions