• Status: Solved
  • Priority: Low
  • Security: Public
  • Views: 63
  • Last Modified:

jQuery Replacing Text?

I have the following jQuery code which sort of works but not exactly what I want.  I need to select the table cell that contains the value "Not Reviewed" and wrap it with the Red span.  If the table cell contains just "Reviewed" I want to wrap it with the Green span tag.

It's works but with undesirable results.  "Reviewed" gets colored green in both places. See screenshot.

Undesirable results screenshot.
I'm not that good with jQuery. Please help :)

Here's my code:

<script type="text/javascript">
$(document).ready(function () {
	$("td.ms-gb2:contains('Not Reviewed')").html(function(_, html) {
		return html.replace(/(Not Reviewed)/g, "<span style='color:red'>$1</span>");
	});
	$("td.ms-gb2:contains('Reviewed')").html(function(_, html) {
		return html.replace(/(Reviewed)/g, "<span style='color:green'>$1</span>");
	});
});
</script>

Open in new window

0
greddin
Asked:
greddin
  • 3
  • 2
1 Solution
 
Ryan ChongCommented:
quick fix, try change the sequence of scripts.. like:

<script type="text/javascript">

$("td.ms-gb2:contains('Reviewed')").html(function(_, html) {             return html.replace(/(Reviewed)/g, "<span style='color:green'>$1</span>");       }); });

$(document).ready(function () {       $("td.ms-gb2:contains('Not Reviewed')").html(function(_, html) {             return html.replace(/(Not Reviewed)/g, "<span style='color:red'>$1</span>");       });       

</script>
0
 
greddinAuthor Commented:
Thanks Ryan, I'm having trouble copying and pasting your script.  Code you show in code view how it's suppose to look?
0
 
greddinAuthor Commented:
Something still isn't right.

Both are green (screenshot)
0
 
Ryan ChongCommented:
ooops, try this instead:

$("td.ms-gb2:contains('Reviewed'):not(:contains('Not Reviewed'))").html(function (_, html) {
            return html.replace(/(Reviewed)/g, "<span style='color:green'>$1</span>");
        });

        $("td.ms-gb2:contains('Not Reviewed')").html(function (_, html) {
            return html.replace(/(Not Reviewed)/g, "<span style='color:red'>$1</span>");
        });

Open in new window

0
 
greddinAuthor Commented:
Yay! Thank you Ryan. That's it!
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

Join & Write a Comment

Featured Post

Ultimate Tool Kit for Technology Solution Provider

Broken down into practical pointers and step-by-step instructions, the IT Service Excellence Tool Kit delivers expert advice for technology solution providers. Get your free copy now.

  • 3
  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now