DOM manipulation: Add 'replace' method

[sebastien@…]

The replace method could be used to replace the actual content of an element. Suppose I have an HTML code like this:

<div>
  <span class="username label">USERNAME</span>
  <span class="useraddress label">USERADDRESS<span>
</div>

and I want to replace the content of the ".username.label" and ".useraddress.label" by some JavaScript-generated value. It would be really cool to have a replace function that could be used as:

$(".username.label").replace("John Smith")
$(".useraddress.label").replace("john.smith@yahoo.com")

[jquery@…]

Javascript already has a native replace() method - it invokes the regular expression engine on a string, and could very easily be used in your scenario (although not as elegant). There might be a more efficient/elegant way to do this with jQuery, however I am still very new to this myself.

For a single-item use:

$('.username.label').text($('.username.label').text().replace(/USERNAME/,'John Smith'));

For n items use:

$('.username.label').each(function()

{

$(this).text($(this).text().replace(/USERNAME/,'John Smith'));

});

}

More info on the JS regex engine can be found here: http://www.regular-expressions.info/javascript.html