jQuery: Change specific text color

问题

I can't seem to figure this out. I have the code below in my web page, how do I change the "Click here" to blue or some color using jQuery?

<td width="30%" valign="top" align="left" 
class="td-label-276-7365 td-label-276 labeltext" 
id="td-label-field-7365">Flavors [Click here] :
</td>

Thank you in advance.

回答1:

If you only want to change the color of "Click here" and you absolutely must use JS, then you can do:

var text = $('td').text();
text = text.replace(/\[Click\shere\]/g, '[<font color="blue">Click here</font>]');
$('td').html(text);

But it is more advisable to just do it directly with html and css, like:

<td width="30%" ...>Flavors [<span class="blue">Click here</span>] :</td>

and in your CSS:

span.blue {
   color: blue;
}

Demo: Both approaches can be seen here

回答2:

use css()

 $('#td-label-field-7365').css('color','blue');

updated

if you need to change color just in [Click here], thn ad span around it and use css()

html

<td width="30%" valign="top" align="left" 
class="td-label-276-7365 td-label-276 labeltext" 
id="td-label-field-7365">Flavors <span>[Click here]</span>
</td>

jquery

$('#td-label-field-7365 span').css('color','blue');

回答3:

$('.labeltext').css('color','blue');

回答4:

$('#td-label-field-7365').css('color', 'blue');

来源：https://stackoverflow.com/questions/15386381/jquery-change-specific-text-color