Javascript 通过共享数据目标属性切换两个元素的活动状态

我目前正在使用下面的功能，根据共享数据目标及其对应的“.seath-map_”部分，切换“.card header”类。我希望对其进行调整，以便在单击“.seath-map_section”和/或“.card header”元素时，添加/删除这两个元素的变量activeClass。我不确定最好的方法是什么，所以任何帮助都将不胜感激

就上下文而言，这就是我想要的效果：

---

你可以这样做：

var$activeItem=$（“.seating-map_节，.card头”）；
var activeClass=“active”；
$activeItem。单击（函数（）{
const id=$（this.attr（'data-target'）；
const$collapse=$（`.card header[data target=${id}]，.seatching-map_section[data target=${id}]`）；
如果（$崩溃）{
$collapse.toggleClass（activeClass）；
}
});
.active{
颜色：红色；
}

座位地图组
卡头
请查看下面的代码。这可能有用

Check: http://jsfiddle.net/mehdi354/5yvds8t2/1/

你能给出你的html代码吗？m354我觉得这很接近。就上下文而言，这就是我希望达到的效果：。我知道这是使用React创建的，但我希望创建类似于vanilla Javascript+jQuery的东西。你可以尝试使用同位素插件来实现这种效果。我来看看同位素。但可能有点超出了当前项目的范围。评论不用于扩展讨论；这段对话已经结束。
Check: http://jsfiddle.net/mehdi354/5yvds8t2/1/