Remove/Hide last occurrence of a string after a link

Question

I have a wp_nav_menu structure that outputs a menu with only the a link and also an after string with the link. How can I remove or hide the last occurrence (The one after the last link) of that after string with jQuery? See code below.

<p id="para"> 
<a href="#">Item One</a> &nbsp;&bull;&nbsp; 
<a href="#">Item Two</a> &nbsp;&bull;&nbsp; 
<a href="#">Item Three</a> &nbsp;&bull;&nbsp;
</p>

I'm trying to remove the last occurrence of "  •  ". Any help is greatly appreciated.

Thanks in advance.

Answer 1

You can make use of nodeValue

DEMO: http://jsfiddle.net/7sy9W/

$('#para a:last-child')[0].nextSibling.nodeValue = ""; 

EDIT:: Pure javascript in case you not use jquery. Actually this might be better

document.getElementById("para").lastChild.nodeValue = '';

Answer 2

since you haven't shown any code.. i'm gonna give you a silly one.. it works though...

$(document).ready(function() {
var $a = $("#para a") ;
$("#para").empty() ;
$a.each(function() {
  $("#para").append(this);
});
});

jsfiddle demo

Answer 3

idk wat exct u want bt i had tried something with php

<?php
$str= '<p id="para"> 
<a href="#">Item One</a> &nbsp;&bull;&nbsp; 
<a href="#">Item Two</a> &nbsp;&bull;&nbsp; 
<a href="#">Item Three</a> &nbsp;&bull;&nbsp;
</p>';

echo substr($str, 0, strrpos( $str, ' ') );
?>

Answer 4

You may try this,

HTML

<p id="para"> 
    <a href="#">Item One</a><span> &nbsp;&bull;&nbsp; </span>
    <a href="#">Item Two</a> <span>&nbsp;&bull;&nbsp; </span>
    <a href="#">Item Three</a><span> &nbsp;&bull;&nbsp;</span>
</p>

JS

$(document).ready(function(){
    $('#para a+span').last().hide()
});

http://jsfiddle.net/bPxMj/

EDIT

If it is not possible to place the extra data within a span element (as informed in the comments) then you may try

$(document).ready(function(){
    $('#para').contents().each(function(i){
        if(i==$('#para').contents().length-1){
          $(this).remove();
        }
    });
});

http://jsfiddle.net/bPxMj/1/