Javascript 置换前加类

您好，我正在尝试使用jquery替换上一个附加类。但是我的测试代码工作不正常

我从codepen.io创建了这个

上一次单击的颜色位置需要保留新单击的重命名

如果您检查开发者控制台中的页面。当您单击红色颜色div时。此颜色类会自动添加。changeBgcolor div类似

<div class="changeBgcolor red"></div>

.changeBgcolor{
填充：30px；
边框底部：1px实心#d8dbdf；
}
凯克先生{
浮动：左；
高度：30px；
利润率：0px 30px；
光标：指针；
文本对齐：居中；
线高：30px；
填充：10px；
}
.颜色{
位置：相对位置；
填充：30px 0px；
}
瑞德先生{
背景色：红色；
颜色：#ffffff；
}
蓝先生{
背景颜色：蓝色；
颜色：#ffffff；
}
格林先生{
背景颜色：绿色；
颜色：#ffffff；
}
黄先生{
背景颜色：黄色；
}
.橙色{
背景颜色：橙色；
}
布莱克先生{
背景色：黑色；
颜色：#ffffff；
}

背景变色盒
红色
蓝色
绿色
黄色的
橙色
黑色

您可以将原始类存储在变量中，然后单击添加已单击div的类

var c=$（“.changeBgcolor”）.attr（'class'））
$（'.color>div'）。单击（函数（）{
$（“.changeBgcolor”）.attr（'class'，c+'+$（this.attr（'class'））.split（''）[1]）
})

.changeBgcolor{
填充：30px；
边框底部：1px实心#d8dbdf；
}
凯克先生{
浮动：左；
高度：30px；
利润率：0px 30px；
光标：指针；
文本对齐：居中；
线高：30px；
填充：10px；
}
.颜色{
位置：相对位置；
填充：30px 0px；
}
瑞德先生{
背景色：红色；
颜色：#ffffff；
}
蓝先生{
背景颜色：蓝色；
颜色：#ffffff；
}
格林先生{
背景颜色：绿色；
颜色：#ffffff；
}
黄先生{
背景颜色：黄色；
}
.橙色{
背景颜色：橙色；
}
布莱克先生{
背景色：黑色；
颜色：#ffffff；
}

背景变色盒
红色
蓝色
绿色
黄色的
橙色
黑色

谢谢，这个答案正是我想要的。你救了我。

<div class="changeBvcolor red blue"></div>

<div class="changeBgcolor">Background color changing BOX</div>
<div class="color">
   <div class="kek red" id="1">Red</div>
   <div class="kek blue" id="2">Blue</div>
   <div class="kek green" id="3">Green</div>
   <div class="kek yellow" id="4">Yellow</div>
   <div class="kek orange" id="5">Orange</div>
   <div class="kek black" id="6">Black</div>
</div>