使用.replace用javascript替换HTML字符串

Question

I have this html code:

<p>Hello, this is a test replacing, <span class="myclass">over test</span> and <span class="myclass">over test</span>.</p>

My javascript works to replace the word "Hello" with "FuuBar".

document.body.innerHTML = document.body.innerHTML.replace(/Hello/g, "FuuBar");

But I can not replace <span class="myclass">over test</span> by <span class="thanks"><b>Thanks God</b></span>

I am starting in javascript. I need to resolve this in pure js. Could help in my code? And sorry for the English.

JsFiddle for help.

Answer 1

Use the DOM for this. Check here for more info: https://developer.mozilla.org/en-US/docs/DOM

var spans = document.querySelectorAll('.myclass');
for (var i=0; i<spans.length; i++) {
  spans[i].classList.remove('myclass');
  spans[i].classList.add('thanks');
  spans[i].innerHTML = '<b>Thanks god</b>';
}

Answer 2

Have you checked quotations? You should escape them in the classname in JS or use single quotes. Please provide the code if that's not the case.

Other than that, replacing the whole body doesn't seem the best idea for a task like this.