How to remove HTML tags from a string in JavaScript

In this tutorial, we'll take a look at some techniques you can use to remove unwanted HTML from user input.
The idea behind these techniques is that you want to save some user input that may have HTML tags inside it, for example, if your app has a rich text editor. However, you want to make sure the user doesn't provide any malicious content that may harm and affect other users.
I'm taking the point of view that your app will be a single page app that needs to dynamically insert content into the page using innerHTML or something similar with JavaScript.
#javascript #webdevelopment Channel Handle @codebubb

[@codewithbubb]

I'll be doing a video on schema validation next week to follow this up!

[@euphoricwolf]

Hi! How can I get a sound effect to play when I hover over a specific word? I just started learning CSS/HTML

[@codewithbubb]

Hey! Thanks for the question - you might want to consider NOT doing that (as it won't work particularly well on mobile devices for example) but you can use the mouseenter / mouseleave events if you want to do something specific with JavaScript. Check out this tutorial for a bit more info: th-cam.com/video/1xEfqgElMsY/w-d-xo.html

[@VishwaJay]

This video was absolutely fantastic!
I liked, subscribed, and here's a comment.
But now I'd like to suggest a video, if I may?
Forgive the length, I feel it's necessary because of the sheer number of people who answer a similar or related question, which somehow sidesteps the original question altogether..
How about a video about the use of Selection and Range that allows us to "toggle" a tag around the selection? I get that we can add a tag, possibly with surroundContent, but how might we take it away afterward? The surroundContent functionality is one-way, as it should be. But what's the inverse of that?
As an example: if I have an `Absolutely fantastic sentence with multiple uses of a single tag within,` then how might I be able to select whichever tag I'd like?
Us beginners don't even know how to ask the question, apparently. But that's one question I keep having zero luck with (after a year of asking around). I hope it's clear enough.

[@codewithbubb]

Hey Vishwa! Thanks very much for your support.
That's a very interesting question, it would be good to do a video on that.
I guess a quick thought on it though, it should just be a case of removing the surrounding/wrapped tag from the document once you are done with it.
I had a little play and it's fairly simple to remove the surrounding tag with document.body.removeChild() but of course any contents inside it are also removed (i.e. the original wrapped content will be removed).
I think the solution to this depends a little on how you the wrapped elements are created initially - if they're just loaded into the DOM in the HTML then you'd need to save a reference to this content before removing the wrapped tag so it can be re-added afterwards.
If the content is being created dynamically with JavaScript then it would be a case of amending the code to keep a reference to the content so it can be regenerated.
Have you got a specific example of what you're trying to do? It might help to come up with a full solution.

[@VishwaJay]

@@codewithbubb Well, all I can say is that I'm trying to replace the functionality of execCommand formatting, if that makes sense.