Removal of <mark> tags

[Gargantua]

Below I have a basic text highlighter code, which is functional. Still, I have encountered one issue: If I want to change the word that needs to be highlighted in the paragraph, the previously entered word remains highlighted.

HTML Code:

For removing the tags around the highlighted words, I used the .removeChild() method as shown. However, it doesn’t seem to work.

JS Code:

Any idea where I am making a mistake??

Link for the code in CodePen:

CodePen Link

[bbsmooth]

I think your logic is off here just a little. What happens when you initially open the app and haven’t searched for any words yet, so nothing is marked, and then you click the Search button?

Also, removeChild will remove not only the element but the text in the element. You just want to remove the mark tags, right? You don’t actually want to remove the text that was in the mark tags?

Also, what if I search for the word “the”. There are six of them that get marked. You want to unmark all of them on the next search, right?

I would google “how to strip html tags from text”. You should get a variety of different methods to do what you want to do.

[Gargantua]

Yeah… I want to remove just the tags and the text in between the tags needs to remain as it is.

1. On clicking the search button without entering any word, the whole paragraph disappeared.
2. I forgot that ‘.removeChild()’ removes the text in between as well. Thanks for pointing it out.

Will google search as you suggested and will get back. Thanks for the help.