How to remove text from a string in JavaScript?

There are three methods to remove the text from a string which are listed below:

Method 1: Using replace() method: The replace method can be used to replace the specified string with another string. It takes two parameters, first is the string to be replaced and the second is the string which is replacing from the first string. The second string can be given an empty string so that the text to be replaced is removed. This method however only removes the first occurrence of the string.

Syntax:



string.replace('textToReplace', '');

Example: This example replace the first occurance of string.

filter_none

edit
close

play_arrow

link
brightness_4
code

<!DOCTYPE html>
<html>
  
<head>
    <title>
        How to remove text from
        a string in JavaScript?
    </title>
</head>
  
<body>
    <h1 style="color: green">
        GeeksforGeeks
    </h1>
      
    <b>
        How to remove text from a
        string in JavaScript?
    </b>
      
    <p>Original string is GeeksforGeeks</p>
      
    <p>
        New String is: <span class="output"></span>
    </p>
  
    <button onclick="removeText()">
        Remove Text
    </button>
      
    <script type="text/javascript">
        function removeText() {
            originalText = 'GeeksForGeeks';
            newText = originalText.replace('Geeks', '');
  
            document.querySelector('.output').textContent
                    = newText;
        }
    </script>
</body>
</html>                    

chevron_right


Output:

  • Before clicking the button:
    replace-before
  • After clicking the button:
    replace-after

Method 2: Using replace() method with regex: This method is used to remove all occurrences of the string specified, unlike the previous method. A regular expression is used instead of the string along with the global property. This will select every occurrence in the string and it can be removed by using an empty string in the second parameter.

Syntax:

string.replace(/regExp/g, '');

Example:

filter_none

edit
close

play_arrow

link
brightness_4
code

<!DOCTYPE html>
<html>
      
<head>
    <title>
        How to remove text from a
        string in JavaScript?
    </title>
</head>
  
<body>
    <h1 style="color: green">
        GeeksforGeeks
    </h1>
      
    <b>
        How to remove text from a 
        string in JavaScript?
    </b>
      
    <p>Original string is GeeksforGeeks</p>
      
    <p>
        New String is: <span class="output"></span>
    </p>
  
    <button onclick="removeText()">
        Remove Text
    </button>
      
    <script type="text/javascript">
        function removeText() {
            originalText = 'GeeksForGeeks';
            newText = originalText.replace(/Geeks/g, '');
  
            document.querySelector('.output').textContent
                    = newText;
        }
    </script>
</body>
</html>                    

chevron_right


Output:

  • Before clicking the button:
    replace-global-before
  • After clicking the button:
    replace-global-after

Method 3: Using substr() method: The substr() method is used to extract parts of a string between the given parameters. This method takes two parameters, one is the starting index and the other is the length of the string to be selected from that index. By specifying the required length of the string needed, the other portion can be discarded. This can be used to remove prefixes or suffixes in a string.

Syntax:

string.substr(start, length);

Example:

filter_none

edit
close

play_arrow

link
brightness_4
code

<!DOCTYPE html>
<html>
  
<head>
    <title>
        How to remove text from a
        string in JavaScript?
    </title>
</head>
  
<body>
    <h1 style="color: green">
        GeeksforGeeks
    </h1>
      
    <b>
        How to remove text from a
        string in JavaScript?
    </b>
      
    <p>Original string is GeeksforGeeks</p>
      
    <p>
        New String is: <span class="output"></span>
    </p>
  
    <button onclick="removeText()">
        Remove Text
    </button>
      
    <script type="text/javascript">
        function removeText() {
            originalText = 'GeeksForGeeks';
            newText = originalText.substr(3, 9);
  
            document.querySelector('.output').textContent
                    = newText;
        }
    </script>
</body>
  
</html>                    

chevron_right


Output:

  • Before clicking the button:
    substr-before
  • After clicking the button:
    substr-after


My Personal Notes arrow_drop_up

Technical Writer Lets have an update

If you like GeeksforGeeks and would like to contribute, you can also write an article using contribute.geeksforgeeks.org or mail your article to contribute@geeksforgeeks.org. See your article appearing on the GeeksforGeeks main page and help other Geeks.

Please Improve this article if you find anything incorrect by clicking on the "Improve Article" button below.