解决js添加的标签hover不起作用

我在做一个页签的时候，有一个关闭的X，需要实现一个功能，就是鼠标移入的时候变颜色。

首先，这个元素是在js里面动态添加的，这里我定义一个class=my_close

 $("#myTab").append("<a class='my_close'>X</a>");

 css实现hover:

 .my_close:hover {
            color: #FFCC33;
        }

如果是正常的html代码，就能够完成鼠标移入变色效果。但由于我是js动态添加的标签，而hover属于伪类，优先级不够，导致丢失。

解决方法：后面加上 !important即可

 .aui_close:hover {
            color: #FFCC33 !important;
        }

如下图所示：成功了！

css选择器的优先级：

!important>style>css伪类>id>class。