Remove any word using remove () in jquery

Question

Hi friends, I want to create a function that removes any specific word in the content

I got this code

Jquery

<script> $(document).ready(function(){ $('#cl').click(function(){ $('div').remove(':contains("kamal")'); }); }) </script> 

HTML

 <div>asdjh alsdhj kamal ljkahsdhasd lakshd kamal</div> <div ><a href="#" id="cl">click</a></div> <div>asdjh alsdhj ljkahsdhasd lakshd </div> 

but its removal of entire kamal contains kamal I want to remove only this word from my content, not the entire div, you can also see an online demonstration of my code here

Please help me

Thanks in advance:)

Answer 1

The correct way to read-modify-write in an element is to use jQuery "function parameter":

 $('div:contains(kamal)').filter(function() { return $(this).children().length === 0; // exclude divs with children }).text(function(index, text) { return text.replace(/kamal/g, ''); }); 

this avoids calling .text() twice, and also simplifies the logic of the code.

Please note that you can get unusual results if you have nested div tags, since the :contains() pseudo- :contains() considers all descendants, not just direct children, and makes them top-down, not bottom-up. This is why the above solution includes an initial .filter call to make sure that only leaf nodes in the DOM tree are considered.

An alternative method is to use .contents and look directly at the DOM text nodes:

 var re = /kamal/gi; $('div').contents().each(function() { if (this.nodeType === 3 && this.nodeValue.match(re)) { this.nodeValue = this.nodeValue.replace(re, ''); } })​ 

See http://jsfiddle.net/alnitak/eVUd3/

EDIT second example updated to use string.match(regex) instead of regex.test(string) .

Answer 2

This should work for you.

  <script> $(document).ready(function(){ $('#cl').click(function(){ var ka = /kamal/gi; $('div').contents().each(function() { // this.nodeType === 3 selects the text nodes section of the DOM // then ka.test(this.nodeValue) performs a regex test on the text // in the node to see if it contains the word "kamal" with the // global /g flag to search the entire string and /i to be case // insensitive if (this.nodeType === 3 && ka.test(this.nodeValue)) { this.nodeValue = this.nodeValue.replace(ka, ''); } // this section catches the text nodes within the child and // performs the same operation $(this).contents().each(function() { if (this.nodeType === 3 && ka.test(this.nodeValue)) { this.nodeValue = this.nodeValue.replace(ka, ''); } }) }) }) }); </script> 

edit : replaced replacing a simple string with a global regex, so that one click replaces all instances. see http://jsfiddle.net/kamui/U7PT3/3/ for a working example.

edit:. Based on a comment from @Alnitak, which was right, noting that the previous version of the code removed entire child elements containing text, not just text, the new updated version does not violate the DOM and removes all instances of the “kamal” keyword, see the updated jsfiddle http://jsfiddle.net/kamui/U7PT3/6/

Answer 3

 var $div = $('div'); $div.text($div.text().replace('yourword', '')) 

Answer 4

The delete function removes the node from the DOM, not only its contents

try $('div).text().replace('kamal','');

edit: this one works

 $('div').text($('div').text().replace('kamal', '')); 

http://jsfiddle.net/qH4CJ/

Answer 5

Use this:

  $('#cl').click(function(){ $('div').each(function(){ $(this).text($(this).text().replace(/kamal/g, ''); }); }); 

Answer 6

Since text () gets the value, and text ("someValue") sets the value, you just put it inside another. this should work for you

http://jsfiddle.net/nnsP4/

 $(document).ready(function() { $('#cl').click(function(){ $('div:contains("kamal")').each(function(){ var text = $(this).text(); var newValue = text.replace('kamal', ''); $(this).text(newValue); }); }); 

});

Answer 7

You can use replace method

 $('#cl').click(function(){ $('div').text($('div').text().replace('kamal','')); });