Last Updated on August 7, 2022 by Roshan Parihar
In this tutorial, learn how to remove string from string using jQuery. The short answer is to use the replace() function to delete text from a string.
There are many different useful methods to perform this task. Let’s find out with the examples given below.
Method 1: jQuery Remove String from String Using replace() and ‘/g’
If you want to remove the string from the string, you have to use the replace() that takes two arguments. The first argument is the string to remove from the given string with the global symbol ‘g‘. The global text ‘g‘ shows that it scans all the content of the string if matching with the string to remove.
See the example given below to learn the method.
|
1 2 3 4 5 6 7 8 9 10 11 12 |
<script> $(document).ready(function(){ $('button.btnRemove').click(function(){ var myTxt = $('.mystr').text(); var myNewStr = myTxt.replace(/Welcome/g,''); $('.resultStr').html('<strong>The new string is: </strong>'+myNewStr); }); }); </script> <p class="mystr">WelcomeHow are you today?</p> <button type="button" class="btnRemove">Remove String 'Welcome'</button> <p class="resultStr"></p> |
Output
WelcomeHow are you today?
Now, click the button given above to remove the specified string from the given string. The string contains the ‘Welcome’ text that you have to remove. When you click the button, the resulted string is without the ‘Welcome’ text.
Method 2: Using split() and join() to Delete String from String in jQuery
To delete the string from the string, you have to use the split() function with join() function. You have to first get the text content of the string using text() function. After that, use the above two functions with the argument as a string that you have to delete.
|
1 2 3 4 5 6 7 8 9 10 11 12 |
<script> $(document).ready(function(){ $('button.btnDelete').click(function(){ var myTxt = $('.mystr').text(); var myNewStr = myTxt.split('Hello').join(''); $('.resultStr').html('<strong>The new string is: </strong>'+myNewStr); }); }); </script> <p class="mystr">HelloWhere are you?</p> <button type="button" class="btnDelete">Delete String 'Hello'</button> <p class="resultStr"></p> |
Output
HelloWhere are you?
The above example contains the string with the text ‘Hello’ that you have to delete. You have to click the above button to delete this string from the given string.
Method 3: Using replace() and RegExp() of jQuery
In addition to the above example, you can also remove the specified string from the string using replace() and RegExp() function. It is also required to get the text content using the text() function.
The RegExp() function takes two arguments in which the first is the text content to remove. The second is the global symbol ‘g‘. See the example given below to learn the method.
|
1 2 3 4 5 6 7 8 9 10 11 12 |
<script> $(document).ready(function(){ $('button.btnRemove').click(function(){ var myTxt = $('.mystr').text(); var myNewStr = myTxt.replace(RegExp('World','g'),''); $('.resultStr').html('<strong>The new string is: </strong>'+myNewStr); }); }); </script> <p class="mystr">WorldEverything is fine?</p> <button type="button" class="btnRemove">Remove String 'World'</button> <p class="resultStr"></p> |
Output
WorldEverything is fine?
The above example contains the text ‘World’ that you have to remove from the given string. When you click the above button, you will get the new string without the text ‘World’.
You May Also Like to Read