I have the following html tag (which is custom):
<meltdown-code data-lang="HTML">
<span><br>
<p>Hi</p><br>
</span><br>
</meltdown-code>
Simple enough. Now, I'm trying to make the HTML tags show as plain text, instead of being rendered as a separate element. To do that, I am replacing all the < with <, and all the > with >
tagHTML.replace(/</g, '<')
The problem: This also replaces the <br> tags, which doesn't create a new line. Here is the solution, in a perfect world:
tagHTML.replace(/</g, '<', {exceptions: '<br>'})
Obviously, that's not how it works. Any help is appreciated.
Thanks!
Negative lookahead for <br> before matching <.
const text = `<meltdown-code data-lang="HTML">
<span><br>
<p>Hi</p><br>
</span><br>
</meltdown-code>`;
const output = text.replace(/(?!<br>)<([^>]+)>/g, '<$1$gt;');
console.log(output);<code></code>