Remove any text not inside element tag on a web page with JavaScript?

Javascript Web Development Object Oriented Programming

To remove text, use the concept of remove(). Use filter to get the content not inside element tag.

Let’s say the following is our HTML −

<div><h1>Demo Program</h1></div>
This is also Demo Program

And we have to remove “This is also Demo Program” since it is not under element tag. For that, the compete code is as follows using filter() and remove() −

Example

Live Demo

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initialscale=1.0">
<title>Document</title>
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
</head>
<body>
<div><h1>Demo Program</h1></div>
This is also Demo Program
<script>
   $('body').contents().filter(function(){
      return this.nodeType != 1;
   }).remove();
</script>
</body>
</html>

To run the above program, save the file name “anyName.html(index.html)” and right click on the file. Select the option “Open with Live Server” in VS Code editor.