jquery find text and replace (all)

Question

<div id="id1">

   apple

   ball

   dogsss

   dogsssdogsss

   dogsssdogsssdogsss

</div>

How Do I change ALL dogsss to dollsss using jquery?

Here is a code, but how to determine the element?

$('#id1 how???').each(function() {
    var text = $(this).text();
    $(this).text(text.replace('dog', 'doll')); 
});

Here is similar question http://stackoverflow.com/questions/8146648/jquery-find-text-and-replace

possible duplicate of [Replace all occurances in javascript](http://stackoverflow.com/questions/13013474/replace-all-occurances-in-javascript) — GillesC, Aug 07 '15 at 07:44

Tushar · Accepted Answer · 2015-08-07T07:52:12.220

9

Your replace will only remove first occurrence from the string. Use regex with replace to remove all occurrences. Use global flag i.e. g in the regex to replace all occurrences.

Change

$(this).text(text.replace('dog', 'doll'));

To

$(this).text(text.replace(/dog/g, 'doll'));

Also, you can use text() with callback to update the innerText of element.

Demo

$('#id1').text(function(i, oldText) {
  return oldText.replace(/dog/g, 'doll');
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.0/jquery.min.js"></script>
<div id="id1">

  apple ball dogsss dogsssdogsss dogsssdogsssdogsss

</div>

edited Aug 07 '15 at 07:52

answered Aug 07 '15 at 07:40

Tushar

85,780
21
159
179

I think is $(this).text(text.replace(/dog/g, 'doll')); – Jkike Aug 07 '15 at 07:41
2

It's nice when an answer explain thing too, rather than just give code that work. – GillesC Aug 07 '15 at 07:43

score 1 · Answer 2 · answered Aug 07 '15 at 07:42

You can use .text with callback, and use regex with /g modifier

$('#id1').text(function(index, text) {
    return text.replace(/dog/g, 'doll'); 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="id1">
   apple
   ball
   dogsss
   dogsss
   dogsss
</div>

score 1 · Answer 3 · answered Aug 07 '15 at 07:43

Instead of using replace(), use split() and join(), which will replace all occurrences instead of just the first one:

$('#id1').each(function() {
    var text = $(this).text();
    $(this).text(text.split("dog").join("doll")); 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="id1">

   apple

   ball

   dogsss

   dogsss

   dogsss

</div>

score 1 · Answer 4 · answered Aug 07 '15 at 07:45

1

You should use the '/g' for global in your regular expression. Otherwise only the first match gets replaced.

$(this).text(text.replace(/dog/g, 'doll'));

answered Aug 07 '15 at 07:45

LcKjus

121
6

score 0 · Answer 5 · answered Aug 07 '15 at 07:44

That's it:

$('#id1').text(function(index, oldText) {
  return oldText.replace(/dog/g, 'doll');
})

// or not use a function
// $('#id1').text($('#id1').text().replace(/dog/g, 'doll'));

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="id1">

  apple ball dogsss dogsssdogsss dogsssdogsssdogsss

</div>

jquery find text and replace (all)

5 Answers5