如何使用addClass（）在类的类列表中添加类

Question

我的HTML中有一个div

    <button id="abc" class="btn btn-primary btn-block"></button>

我需要添加一个类＆＃39; alert-danger＆＃39;在鼠标悬停。所以我使用了以下代码

    $(document).on("mouseover","#abc",function()
    {
          $(this).addClass("alert-danger");
    });

这样可以正常工作，它将类附加在类列表的末尾，如下所示

    <button id="abc" class="btn btn-primary btn-block alert-danger"></button>

但问题是＆＃39; btn＆＃39;并且警报危险＆＃39;类有一些常见的CSS规则。 ＆＃39; BTN＆＃39;优先（因为它是列表中的第一个）并禁用“警报 - 危险”的规则。所以我的按钮应该是这样的，警告 - 危险＆＃39; class作为班级列表中的第一个。

    <button id="abc" class="alert-danger btn btn-primary btn-block"></button> // My requirement 

如何修改我的addClass（）以便预先添加类而不是附加它。

Answer 1

可替换地：

$(document).on("mouseover","#abc",function(){
$(this).removeClass("alert-danger");
$(this).attr("class","alert-danger "+$(this).attr("class"));})

检查jsfiddle。

Answer 2

替代您的要求。

您可以在!important类中将alert-danger标记为css属性，这将根据您的要求确定css效果的优先级。

查看此fiddle演示。