jQuery更改标题/标题中第二个单词的颜色

我目前正在使用此JavaScript更改每个小部件标题中第二个单词的颜色。但有了这段代码，当它在每个小部件中循环时，它最终会在每个小部件标题中打印页面上所有小部件的所有标题。例如，我有两个小部件，标题是“最近的工作”和“最近的新闻”。工作和压力应该是橙色的。使用此代码，它输出“最近的工作最近的新闻”，其中工作和最近的都是橙色的。这在两个小部件标题中打印相同。我如何编辑它，使之成为第二个或最后一个，因为每个标题只有两个词长，橙色这个词

var split = $("h4.widgettitle").text().split(" ");

if(split.length > 0) {
$("h4.widgettitle").html('').append("<span class='firstWord'>" + split[0] + "<span> ");

if(split.length > 1) {
    $("h4.widgettitle").append("<span class='secondWord'>" + split[1] + "<span> ");
    for(var i=2;i<split.length;i++) {
        $("h4.widgettitle").append(split[i] + " ");
    }
  }
}

var split=$（“h4.widgettitle”）.text（）.split（“”）；
如果（拆分长度>0）{
$（$h4.widgettitle”）.html（“”）.append（“+split[0]+”）；
如果（拆分长度>1）{
$（$h4.widgettile”）.append（“+split[1]+”）；
对于（var i=2；i最快方式：

$('h4.widgettitle').each(function(){

    var text = $(this).text().split(' ');
    if(text.length < 2)
        return;

    text[1] = '<span class="secondWord">'+text[1]+'</span>';

    $(this).html( text.join(' ') );

});

$（'h4.widgettitle'）。每个（函数（）{
var text=$（this.text（）.split（“”）；
如果（text.length<2）
返回；
文本[1]=''+文本[1]+''；
$（this.html（text.join（“”））；
});

这样的东西应该适合您。它会将所有h4.widgettitle元素中的第二个单词涂成红色，而不管标题中有多少单词

$("h4.widgettitle").each(function(){
    var title_list = $(this).text().split(" ");
    var new_title = "";
    for (var i = 0; i < title_list.length; i++) {
        if (i == 1) {
            new_title += "<span class='secondWord'>" + title_list[i] + "</span> ";
        } else {
            new_title += "<span class='notSecondWord'>" + title_list[i] + "</span> ";
        }
    }
    $(this).html(new_title);
})​​

$（“h4.widgettile”）.each（function（）{
var title_list=$（this）.text（）.split（“”）；
var new_title=“”；
对于（变量i=0；i

在一个
中查看它，您只需执行一次即可帮助提高性能并清理代码：var$h4=$（“h4.widgettitle”）；然后，访问变量，而不是每次都进行研究。