replace Specific text to html

Question

how to replace or change specific text to new html?

Old HTML:

<div id="test">    
    <p>
        [b] lorem ipsum [/b]
    </p>
    <p>
        [textarea] lorem ipsum [/textarea] 
    </p>
</div>

New HTML:

<div id="test">
    <p>
        <b>lorem ipsum</b>
    </p>
    <p>
        <textarea>lorem ipsum</textarea>
    </p>
</div>

Force_Tag = [
    '[b]','<pre>',
    '[/b]','</b>',
    '[textarea]','<textarea>',
    '[/textarea]','</textarea>',
    // ...
]

Answer 1

You can use String.prototype.replace() with RegExp /(\\[)|(\\])/g to capture "[" , "]" , replace first capture group with "<" , second capture group with ">" , set .innerHTML of elements to replacement strings

 <div id="test"> <p> [b] lorem ipsum [/b] </p> <p> [textarea] lorem ipsum [/textarea] </p> </div> <script> for (let p of document.querySelectorAll("#test p")) { p.innerHTML = p.innerHTML.replace(/(\\[)|(\\])/g, function(match, p1, p2) { if (p1) return "<"; if (p2) return ">" }) } </script>