为什么我的字体颜色没有被应用？

Question

如果我在标签上设置了这样的字体：

<label id="lblrptgenprogress" class="invisible redfont">Report generation list is being constructed...</label>

...它有效（我删除“隐形”类后，我看到文本为红色）。

但是，如果我尝试在另一个标签中设置这样的颜色：

<label id="testsettingproduceusage" class="midnightbluefont"></label>

...标签中没有文字开头，但稍后动态添加，它不起作用 - 动态添加的文字仍为默认黑色。为什么？我怎样才能让它尊重指定的班级？

我以这种方式在AJAX调用中为标签提供了一些文本：

. . .
success: function (returneddata) {
    var nextgendate = returneddata.testsettings.NextGenDate;
    var nextfromdate = returneddata.testsettings.NextFromDate;
    var nexttodate = returneddata.testsettings.NextToDate;

    var verbiage = 'If you save the current configuration, the Produce Usage report would next be sent on ' +
        nextgendate +
        ' and emailed to ' +
        addressees +
        '; the report would cover data from ' +
        nextfromdate +
        ' to ' +
        nexttodate;
    $("#testsettingproduceusage").append(verbiage);
    document.body.style.cursor = 'pointer';
},
. . .

CSS是：

.redfont {
    color: red;
}

.midnightbluefont {
    color: midnightblue;
}

更新

特殊性，正如评论所示：

.midnightbluefont {
    /*color: midnightblue;*/ <= doesnt' work
    /*color: #191970;*/ <= doesn't work
    /*color: #191970 !important;*/ <= works
    color: midnightblue !important; <= works
}

Answer 1

蛮力的工作方式是：

.midnightbluefont {
    color: midnightblue !important;
}

......或者这个：

.midnightbluefont {
    color: #191970 !important;
}