2

I'm trying to remove an em dash from a pre made piece of code. However, it is imbedded in the tree and I cannot seem to access it:

jsFiddle

HTML:

  <span class="price">           
        <span class="price">
            <span class="amount">£8.75</span>
            – // I need this!
            <span class="amount">£19.20</span>
        </span>
    </span>

JS:

$('span.price').each(function(){
    $(this)
        .find('.amount')
        .next()
        .remove()

    var c = $(this);
    var t  = c.text();
    var b = t.replace('—', '@'); // but if i use ('£', '@') it replaces the pound sign
    c.text(b);

});

Would anyone know why the above does not find and replace the '—' dash?

Improve this question
1
  • Why it doesn't work? It does, though I replaced the - character you had in your replace() with this one –: demo. Commented Apr 14, 2014 at 11:34

6 Answers 6

Reset to default
4

You can use a combination of .contents() and .filter to find all text nodes whose content is - and remove it:

$(".price").contents().filter(function() {
    return this.nodeType == 3 && $.trim(this.textContent) === "–";
}).remove();

jsFiddle

edit: Changed to use jQuery's trim rather than ES5 as this will work on < IE9

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

3 Comments

Much more thorough than my suggestion. I always want to go down this route but can never remember it. Gonna bookmark it this time ;)
@Archer I always revert to looking for text nodes because my regex sucks and it's easier to do a direct compare
This is much easier to read than using regex. Also, I wish my regex sucked. I don't even qualify for that level. My idea of using regex starts with typing google.com :p
2

Funny thing :) I copied "-" from html part of jsfiddle into your code

var b = t.replace("–", '@');

and now replace does work. :)

http://jsfiddle.net/bhAtn/7/

Improve this answer

Comments

1

DEMO

Try below code, it will work

$('span.price').each(function(){
    $(this)
        .find('.amount')
        .next()
        .remove()
    .end();
    var c = $(this);
    var t  = c.text();
    var b = t.replace(/–/g, ' ');
    c.text(b);

});
Improve this answer

Comments

1

This is simplistic and is for your specific purpose, but does the trick...

$('span.price > span.price').each(function(){
    var $this = $(this);
    $this.html($this.html().replace("–", ""));
});

jsfiddle example

Improve this answer

Comments

1

You can get the element content filter only the textnodes and remove them.

Code:

$('span.price').each(function () {
    $(this)
        .contents()
        .filter(function () {
        return this.nodeType == 3; //Node.TEXT_NODE
    }).remove();

});

Demo: http://jsfiddle.net/IrvinDominin/fSMKL/

Improve this answer

Comments

1

You could use the following:

$('span.price span.amount').each(function(){
    if (this.nextSibling) {
        this.nextSibling.nodeValue = this.nextSibling.nodeValue.replace(/—/g,'');
    }
})
Improve this answer

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.