Remove particular content (›) from last a tag in a div

I have a list with breadcrumbs that is generated like this:

<div class="breadcrumps"><a href="#">Link开发者_Go百科1</a>&#8250;<a href="#">Link2</a>&#8250;<a href="#">Link3</a>&#8250;</div>

How can I remove the '›' after the last a tag? Currently I have this code which doesn't work...:(

$(document).ready(function () {
$('.breadcrumps');
$(this).find('a:last-child').remove('›');

});

thanks in advance!

Use substr:

$('.breadcrumps').text(function(x,i){return i.substr(0,i.length-1);});

http://jsfiddle.net/XxDfY/2/

Here is one way to do it:

http://jsfiddle.net/jXBte/

<div class="breadcrumps">
    <a href="#">Link1</a><span>&#8250;</span>
    <a href="#">Link2</a><span>&#8250;</span>
    <a href="#">Link3</a><span>&#8250;</span>
</div>

and the js:

$(document).ready(function () {
    $('.breadcrumps').find('span:last-child').remove();
});

$(document).ready(function() {
    $('.breadcrumps').html(function(index, oldHtml) {
        $(this).html(oldHtml.substring(0, oldHtml.length - 1));
    });
});

Just beware that the DOM elements are being replaced, so old bindings might be lost.

For example,

The following won't work:

$(document).ready(function() {
    $('a').click(function() {
        alert('Clicked');
    });

    $('.breadcrumps').html(function(index, oldHtml) {
        $(this).html(oldHtml.substring(0, oldHtml.length - 1));
    });
});

But this will:

$(document).ready(function() {
    $('.breadcrumps').html(function(index, oldHtml) {
        $(this).html(oldHtml.substring(0, oldHtml.length - 1));

        $('a').click(function() {
            alert('Clicked');
        });
    });
});