Jquery 有关div的问题；悬停、活动、内容

所以我撞到了墙…可能是因为我累了。这是我现在的小提琴

当我将鼠标悬停在div上时，如何使其高亮显示，更具体地说，当它们是活动选项卡时，如何保持特定的颜色，例如红色。那么，如何将信息推送到“内容”分区中？我是否应该使用jQuery来追加

谢谢

<div id="wrapper">
<div id="details">details:</div>
<div id="description">description:</div>

细节：
说明：

---

内容转到此处以获取鼠标上的颜色，只需将

：hover

添加到选项卡的新类：

CSS:

更新小提琴：

jsiddle：

我添加了classbtn，因此在编写css时，可以为所有按钮添加规则：

<div id="wrapper">
    <div id="details" class="btn">details:</div>
    <div id="description" class="btn">description:</div>
</div>
<div id="content">Content Goes Here</div>

要使div处于活动状态，可以在css文件中创建活动css类：

.active{
background: red;
}

然后用jQuery在单击时附加该类，如下所示：

    $(".btn").on("click", function(){
        $(".btn").removeClass("active");
   $(this).addClass("active");
});

这会将当前单击的按钮颜色设置为红色（活动按钮）

要将信息放入content div，可以使用如下jQuery：

$("#details").text("some text");

或单击“详细信息”按钮，例如：

    $("#details").on("click", function(){
   $("#content").text("some text");
});

请检查JSFIDLE上的整个工作示例：

---

活动选项卡是什么意思您用jQuery标记了您的问题，但没有发布任何问题。您可以使用pseudo classsee，这很有帮助，但我正在寻找一种方法，一旦它是活动的、选中的选项卡，就可以保持它的颜色。谢谢！添加类不起作用，但我会继续研究。您回答了大部分问题。为您添加了JSFIDLE。如果有帮助，请投票表决我的答案。谢谢

$("#details").text("some text");

    $("#details").on("click", function(){
   $("#content").text("some text");
});