更改javascript类的背景色

Question

我有这个Javascript ...

<script>          
$('.tile').on('click', function () {

    $(".tile").addClass("flipOutX");
    setTimeout(function(){
        $('metro tile-area-darkCrimson').css('background-color','#f36c20');
        $(".tile-group.main").css({ marginLeft:"-40px", width: "1080px"}).load("musability-musictherapy-company-overview.html");
    }, 2000);

});
</script> 

并且Metro Metro-area-darkCrimson类的定义如CSS中所示。

.metro .tile-area-darkCrimson {
  min-width: 100%;
  height: 100%;
  background-color: #1f255b !important;


    transition: background-color .25s ease-in-out;
    -moz-transition: background-color .25s ease-in-out;
    -webkit-transition: background-color .25s ease-in-out;

}

为什么即使其余功能正常，背景色也不会改变？ 提前感谢了很多帮助。

干杯，格雷格。

编辑---------

我现在从有帮助的人的建议中得到这个

<script>          
$('.tile').on('click', function () {

    $(".tile").addClass("flipOutX");
    setTimeout(function(){
        $('.metro .tile-area-darkCrimson').addClass('color-red');
        $(".tile-group.main").css({ marginLeft:"-40px", width: "1080px"}).load("musability-musictherapy-company-overview.html");
    }, 2000);

});
</script> 

并将其添加到CSS中...

.color-red {背景：＃f36c20; }

但是仍然无法正常工作，我们非常感激。

谢谢，格雷格。

Answer 1

您尝试了没有！important标签的尝试吗？

更改此：

background-color: #1f255b !important;

变成这个：

background-color: #1f255b;

Answer 2

您错过了班级的点符号。 更改此行

 $('metro tile-area-darkCrimson').css('background-color','#f36c20');

至

$('.metro tile-area-darkCrimson').css('background-color','#f36c20');

Answer 3

更改：

$('metro tile-area-darkCrimson').css('background-color','#f36c20');

至

 $('.metro .tile-area-darkCrimson').css('background-color','#f36c20');

Answer 4

您错过了。 用于jQuery中的Metro类

$('.metro tile-area-darkCrimson').css('background-color','#f36c20');

另外最好添加一个类而不是在jQuery中使用.css

$('.metro .tile-area-darkCrimson').addClass('color-red');

并在您的css中上课

.color-red { background :#f36c20; }

`