so here is the scenario: I have a bunch of spans with a class of " price " like that : 12,99€

I needed to split the cents after the a so I could style it with css -> that's done , cents got its own class " cents "

Now I'm trying to replace the a "," by the € euro symbol, and remove the € symbol at the end 'replace it with nothing, empty)

I hope it makes sense, here is an example...:

How it is now: 12,99€ and What I need: 12€99

My code right now:

<!-- the html part CANNOT BE MODIFIED -->
<span class="price">29,49€</span>

<script>
jQuery(".price").each(function() {
var newText = jQuery(this).text().split(",").join("</span>,<sup class='cents'>");
newText = "<span class='euros'>" + newText + "</sup>";
jQuery(this).html(newText);
});

// Tryed to replace euro symbol by nothing but doesn't work //
var value = jQuery(".cents").val()+"";
value.replace("€", "");
var val = jQuery(".cents").val();
</script>

I would definitely appreciate if someone could help me out here since I really want to learn how to achieve this. It doesn't look too plicated but can't make it work which is frustating.

so here is the scenario: I have a bunch of spans with a class of " price " like that : 12,99€

I needed to split the cents after the a so I could style it with css -> that's done , cents got its own class " cents "

Now I'm trying to replace the a "," by the € euro symbol, and remove the € symbol at the end 'replace it with nothing, empty)

I hope it makes sense, here is an example...:

How it is now: 12,99€ and What I need: 12€99

My code right now:

<!-- the html part CANNOT BE MODIFIED -->
<span class="price">29,49€</span>

<script>
jQuery(".price").each(function() {
var newText = jQuery(this).text().split(",").join("</span>,<sup class='cents'>");
newText = "<span class='euros'>" + newText + "</sup>";
jQuery(this).html(newText);
});

// Tryed to replace euro symbol by nothing but doesn't work //
var value = jQuery(".cents").val()+"";
value.replace("€", "");
var val = jQuery(".cents").val();
</script>

I would definitely appreciate if someone could help me out here since I really want to learn how to achieve this. It doesn't look too plicated but can't make it work which is frustating.

• javascript
• jquery
• string
• replace
• split

• .val() is for form elements, you should use .text() instead. – kapa Commented Jul 17, 2012 at 20:00

3 Answers 3

$(".price").text( function(i, oldtext){
    return oldtext.replace("€","").replace(",","€")
});

http://jsfiddle/8da54/9/

How about using the following instead:

$(".price").html(function(i, val) {
    val = val.split(",");
    return "<span class='euros'>" + val[0] + "</span>" + "€" +
        "<sup class='cents'>" + val[1].replace("€", "") + "</sup>";
});

DEMO: http://jsfiddle/8da54/11/

You don't need to use replace, you can use slice or substr.

$(".price").html(function(i, oldVal) {
    var value = oldVal.split(",");
    return "<span class='euros'>" + value[0] + "€</span>" +
        "<sup class='cents'>" + value[1].slice(0, -1) + "</sup>";
});

demo