HTML only replaces 1st match

Question

How can I make that this code replaces both paragraphs? I also need it to work with lists.

<p class="demo">Mr Blue has a blue house and a blue car blue blu,e blue bl,ue.</p>
<p class="demo">Mr Blue has a blue house and a blue car blu,e blue bl,ue blue.</p>

<script>
let str = document.getElementByClass("demo").innerHTML; 
let res = str.replace(/,/g, ", ");
document.getElementByClass("demo").innerHTML = res;
</script>

This should answer your question: https://stackoverflow.com/questions/5338716/get-multiple-elements-by-id — Cameron Ford, Apr 11 '22 at 09:34
Does this answer your question? [Get multiple elements by Id](https://stackoverflow.com/questions/5338716/get-multiple-elements-by-id) — DarkBee, Apr 11 '22 at 09:39

score 2 · Accepted Answer · edited Apr 11 '22 at 09:49

2

Never refer by ID, always use classes.

var els = document.getElementsByClassName('kala');
for (var i = 0; i < els.length; i++) {
  els[i].innerHTML = els[i].innerHTML.replace(/,/g, ', ');
}

This kind of a snippet does the job!

edited Apr 11 '22 at 09:49

Troyer

6,765
3
34
62

answered Apr 11 '22 at 09:48

Roomet Sütt

94
2

score 1 · Answer 2 · answered Apr 11 '22 at 09:37

1

You can't use 2 (or more) ids which are equals. Instead of use class:

<p class="demo">Mr Blue has a blue house and a blue car blue blue blue blue.</p>
<p class="demo">Mr Blue has a blue house and a blue car blue blue blue blue.</p>

//

const elements = document.querySelectorAll(".demo"); 

elements.forEach((element) => element.textContent.replace(/blue/g, "red"));

answered Apr 11 '22 at 09:37

CubeStorm

138
6

I updated this code. It doesnt work with commas. – RobinRattasep Apr 11 '22 at 09:42
it also works if we have same ids :) – Arunkumar09 Apr 11 '22 at 09:43
The code as you have it won't work. You need to assign the replaced result back to the element.textContent https://jsfiddle.net/mekpfc9w/ – TiiJ7 Apr 11 '22 at 09:50

HTML only replaces 1st match

2 Answers2