Change a string using jquery selector and javascript regex

Question

All I want to do is replace the letter "y" with the letter "i" in all s with a certain class. I'm not sure why my script isn't working. I know the selector is working because I can swap the method to something like hide() and it works. I also can assign the value of the replace() into a variable, and that variable shows the correct substitution. So I'm boggled why the combination of the two isn't working...

<script type="text/javascript" src=".../jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(
function() {
    $("span.certain_class").text().replace(/y/g, "i");
}
);
</script>';

EDIT: I need to clarify that I need to do this to multiple spans throughout the page. Remember that the text() method stacks up all the texts of each span... so something like this won't work:

$("span.certain_class").text($("span.certain_class").text().replace(...))

Each span will end up with a mess of the other span's text.

score 1 · Accepted Answer · 2011-10-24 16:11:55Z

1

$(document).ready(function() {
    $('span.certain_class').each(function() {
        $(this).text($(this).text().replace(/y/ig, function(s) {
            return (s === 'Y' ? 'I' : 'i');
        }));
    });
});

edited Oct 24, 2011 at 16:11

answered Oct 24, 2011 at 14:33

user21926

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

4 Comments

emersonthis Over a year ago

Thanks! Slightly off-topic follow-up question: I know that the /i flag will make the regex search case-INsensitive, but is there an elegant way to make the replacement correspond to the original case?

emersonthis Over a year ago

Very cool! I didn't realize you could pass a function as the second parameter of replace(). I just want to make sure i understand one thing: where does the "s" parameter of the function get assigned?

user21926 Over a year ago

function(s) <-- there (line 3). That will be set to whatever the regex matches. In this case that would be y or Y.

emersonthis Over a year ago

Got it. Thanks! I have a related question, but it's getting off the original topic, so I started a new question: stackoverflow.com/questions/7921913/…

genesis · Accepted Answer · 2011-10-24 14:31:18Z

0

A typo in first line!

<script type="text/javascript" src=".../jquery.min.js"></script>

should be

<script type="text/javascript" src="../jquery.min.js"></script>

working demo!

or if you want to change it directly to the same span, use

    $("span.certain_class").text($("span.certain_class").text().replace(/y/g, "i"));

http://sandbox.phpcode.eu/g/ab47c/2

answered Oct 24, 2011 at 14:31

genesis

51.1k20 gold badges99 silver badges127 bronze badges

Comments

gion_13 · Accepted Answer · 2011-10-24 14:31:45Z

0

  $("span.certain_class").text(
    $("span.certain_class").text().replace(/y/g, "i")
  );

Your script does correctly replace all the "y"'s with "i"'s but it doesn't assign the value back to the dom element.

answered Oct 24, 2011 at 14:31

gion_13

41.5k10 gold badges99 silver badges111 bronze badges

Comments

Pieter · Accepted Answer · 2011-10-24 14:32:29Z

0

The text() function only gets the contents. But with you're current piece of code you don't replace the contents.

var replacement = $("span.certain_class").text().replace(/y/g, "i");
$("span.certain_class").text(replacement);

answered Oct 24, 2011 at 14:32

Pieter

3,3975 gold badges34 silver badges69 bronze badges

Comments

alexn · Accepted Answer · 2011-10-24 14:33:01Z

0

Well, your solution works but you don't do anything with the result. Do you want to replace the text inside the div? Try this:

$(document).ready(function() {
        var elm = $("span.certain_class");
        var text = elm.text().replace(/y/g, "i"); // Get current text and replace y to i
        elm.text(text); // Set new text
    }
);

answered Oct 24, 2011 at 14:33

alexn

59.2k14 gold badges113 silver badges146 bronze badges

Comments

Frédéric Hamidi · Accepted Answer · 2011-10-24 14:33:06Z

0

text() called without arguments only returns the element's inner text, and since strings are immutable in Javascript, your call to replace() will create a new string that's immediately forgotten.

You can pass a function to text() in order to build the new value from the previous one:

$("span.certain_class").text(function(index, currentText) {
    return currentText.replace(/y/g, "i");
});

answered Oct 24, 2011 at 14:33

Frédéric Hamidi

264k42 gold badges497 silver badges486 bronze badges

Comments

maxedison · Accepted Answer · 2011-10-24 14:33:35Z

0

It should be:

var replaceSpan = $("span.certain_class")
replaceSpan.text(replaceSpan.text().replace(/y/g, "i"));

You need to pass a string to the .text() method. All you're currently doing is grabbing the text of span.certain_class as a string (.text()), performing the replace (.replace(..)), but then not doing anything with the resulting string.

answered Oct 24, 2011 at 14:33

maxedison

17.6k15 gold badges72 silver badges118 bronze badges

Collectives™ on Stack Overflow

Change a string using jquery selector and javascript regex

7 Answers 7

4 Comments

Comments

Comments

Comments

Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

7 Answers 7

4 Comments

Comments

Comments

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related