jQuery replaceText will replace text in specified elements. Note that only text content will be modified, leaving all tags and attributes untouched.

Click these links:

To modify this HTML:

This is some text that contains a link with italic text and bold text as well as a span with a class of test.

  1. this listitem is just text
  2. but this one has a link with italic text and bold text and some more text
  3. and this listitem has some text and an unordered list followed by some more text

And one last paragraph to wrap this example up!

The code

$(function(){
  
  $('.link1').click(function(){
    // Replace all 'text' words with 'TEXT'
    
    $('#test *').replaceText( /\btext\b/gi, 'TEXT' );
  });
  
  $('.link2').click(function(){
    // Wrap all 'this' words in quotes.
    
    $('#test *').replaceText( /\b(this)\b/gi, '"$1"' );
  });
  
  $('.link3').click(function(){
    // Wrap all 'text' words with <span class="red"/>
    
    $('#test').find(':not(textarea)')
      .replaceText( /\b(text)\b/gi, '<span class="red">$1<\/span>' );
  });
  
  $('.link4').click(function(){
    // Wrap all 'a' words, not already wrapped, with <b>, but as text only
    
    $('#test *').replaceText( /(?!<b>)\b(a)\b(?!<\/b>)/gi, '<b>$1<\/b>', true );
  });
  
  $('.link5').click(function(){
    // Wrap all words starting with 'li' with <span class="green"/>, but only if
    // they aren't already wrapped in a span with class of green
    
    function colorize( str ) {
      return '<span class="green">' + str + '<\/span>';
    };
    
    $('#test').find(':not(textarea):not(span.green)')
      .replaceText( /\bli.*?\b/gi, colorize );
  });
  
});