Question

I want to make a content editable div in which I replace explicit words with asterisks. This is my JavaScript code:

function censorText(){
    var explicit = document.getElementById("textbox").innerHTML;
    var clean = explicit.replace(/"badtext1","cleantext1"|"badtext2","cleantext2"/);
    document.getElementById("textbox").innerHTML = clean;
}

Here’s the HTML for my <div contenteditable>:

<div contenteditable="true" onkeyup="censorText()" id="textbox">Hello!</div>

As you can see, I tried using a regex operator to replace multiple strings at once, but it doesn’t work. It doesn’t replace badtext2 with cleantext2, and it replaces badtext1 with 0. How can I make a single .replace() statement replace multiple strings?

Answer 1

use /.../g to indicate a global replace.

var clean = explicit.replace(/badtext1/g,"cleantext2"/).replace(/cleantext1/g,"cleantext2"/).replace(/badtext2/g,"cleantext2"/);