jQuery replace specific text

Question

Simply, How can I replace exact text with HTML using jQuery?

The original text is View All Customer Reviews

I want it to be replaced with <span class="redbutton">View All Reviews &#187;</span>

Thanks.

• Oleksandr Fentsyk: Is this text in some html element?
• henryaaron: Yes, an anchor, but the anchor is not classified nor identified
• Brombomb: you shouldn't need jQuery for this. Javascript has a built in regex match/replace functionality.
• henryaaron: @Brombomb Would you happen to have a solution?
• Brombomb: The solution by @Wally-Qiao below is perfectly acceptable

Answer 1

<div id="_div">xxx|||View All Customer Reviews|||xxx</div>
<script>
$(function() {
var html = $('#_div').html() + '';
html = html.replace(/View All Customer Reviews/g, '<span class="redbutton">View All Reviews &#187;</span>');
$('#_div').html(html);
});
</script>

// ===================----================== ///

<a>xxx|||View All Customer Reviews|||xxx</a>
<a>yyy|||View All Customer Reviews|||yyy</a>
<a>zzz|||View All Customer Reviews|||zzz</a>
<script>
$(function() {
 $('a').each(function(i) {
 var html = $(this).html() + '';
 html = html.replace(/View All Customer Reviews/g, '<span class="redbutton">View All Reviews &#187;</span>');
 $(this).html(html);
 });
});
</script>

• henryaaron: My content isn't wrapped in a div
• Brombomb: If you provided what your content is wrapped in we'd be able to help you more specifically. This solution show how to use jQuery to grab the contents of any html element by id and then replace the text.
• henryaaron: @Brombomb I know I understand the content is wrapped in an unclassified anchor
• Brombomb: use $('a') to grab all anchors. You should be able to narrow this down somewhat with some parent div/class selector.
• Wally Qiao: else if using \r\n and tabs, html.replace(/View(\s*[\r\n|\t]\s*)All Customer Reviews/g, ...) @user1090389

Answer 2

Try this :

http://benalman.com/projects/jquery-replacetext-plugin/