Question

jQuery(document).ready(function(){
jQuery('.breadcrumbs').text(function (i, old) {
return old
.replace('Your-Space', 'Your Space') });
});

I have this “Your-Space” text in the breadcrumbs at the top and the above snippet does replace my text with “Your Space”, without “-“.

But “Your Space” is also a link to that particular category, and the function above removes the link, why is that happening?

Update:
HTML: (if breadcrumb is one level deep)

<div class="breadcrumbs">
<a href="http://www.xxx.com" title="Go to Home.">Home</a> &gt; Your-Tennis-Space</div>

HTML: (if in a category)

<div class="breadcrumbs">
<a href="http://www.xxx.com" title="Go to Home.">Home</a> &gt; 
<a href="http://www.xxx.com/your-space/" title="Go to Your-Space.">Your-Space</a> 

> Browse Categories

Update2:

This is getting confused for me and probably for you two guys as well. To clear it, this snippet works, it does the job:

jQuery(document).ready(function(){
jQuery('.breadcrumbs').html(function (i, old) {
return old.replace('Your-Space', 'Your Space') });
});

But I have the breadcrumbs and when the path is Home > Your Space, “Your Space” is not a link. When I click on a category, I will get the following path where Your Space becomes a link = Home > Your Space > Some random category.

Now, the whole thing work IF I select both classes separately:

jQuery(document).ready(function(){
jQuery('.breadcrumbs').html(function (i, old) {
return old.replace('Your-Space', 'Your Space') });
});

AND

jQuery(document).ready(function(){
jQuery('.breadcrumbs a').html(function (i, old) {
return old.replace('Your-Space', 'Your Space') });
});

(with and without a)

IF I select them like that (jQuery(‘.breadcrumbs, .breadcrumbs a’)), it doesn’t work as in, just the .breadcrumbs is changed, not when is link, so it doesn’t selects .breadcrumbs .

I hope is clear enough, I had to this for me at least as I am very confused now lol.

Answer 1

EDIT :
Here is an example using the parent div as the selector : http://jsfiddle.net/Ax6ps/1/

$('#mybut').click(function() {
    $('.parent-breadcrumb a').text(function(i, old) {
        return old.replace('Click', 'Your Space');
    });
});

OLD ->
Works fine in this example : http://jsfiddle.net/Ax6ps/

<a href="index.html" class="breadcrumb">Click</a><br/>
<a href="index.html" class="breadcrumb">Click</a><br/>
<a href="index.html" class="breadcrumb">Click</a><br/>
<a href="index.html" class="breadcrumb">Click</a><br/>
<a href="index.html" class="breadcrumb">Click</a><br/>
<input type="button" value="Do Something" id="mybut"/>


$('#mybut').click(function() {
    $('.breadcrumb').text(function(i, old) {
        return old.replace('Click', 'Your Space');
    });
});