Javascript 我想创建两个样式相同的选项卡，但js没有'；行不通

我使用的插件（模态窗口）可以创建模态

在同一个页面上，我有两个不同的w3卡（将来可能需要更多相同的布局），我使用模式打开它们

在每个模式上，我有3个选项卡。我是从学校抄的这是链接

但是标签只对其中一张卡有效。我更改了一张卡上的id名以及js部分中的函数名，但仍然不起作用

我该怎么办？ 提前感谢,

（编辑）

一些文本

一些文本

---

然后，我希望在模式中有我共享链接的选项卡（只是因为太多了，我没有将它们粘贴到这里。）

使用下面没有JS的代码

main{
最大宽度：800px；
填充：40px；
边框：1px实心rgba（0,0,0,2）；
背景：#fff；
盒影：0 1px 3px rgba（0,0,0,1）；
}
.主选项卡部分{
显示：无；
填充：20px0；
边框顶部：1px实心#abc；
}
.主选项卡输入{
显示：无；
}
.主选项卡标签{
显示：内联块；
利润率：0-1px；
填充：15px 25px；
字号：600；
文本对齐：居中；
颜色：#abc；
边框：1px实心透明；
}
.主选项卡标签：之前{
字体大小：正常；
右边距：10px；
}
.主选项卡标签：悬停{
颜色：#789；
光标：指针；
}
.主选项卡输入：选中+标签{
颜色：#0af；
边框：1px实心#abc；
边框顶部：2倍实心#0af；
边框底部：1px实心#fff；
}
#表1：选中~#内容1，
#表2：选中~#内容2{
显示：块；
}

表1
表2

测试表1


测试表2

能否提供控制选项卡的Javascript代码？您可能也忘记了选项卡的HTML部分。OP还应该包括用于此的CSS：。嗯，它停止工作，其他卡中的选项卡无法打开。我改变了身份证的名字，但是。。。

<!-- card No.1--> 
<span class="wow-modal-id-1"> <!-- the code that the plugin gives-->
 <div class="w3-card-4">
  <p>Some text</p>
 </div>
</span>

<!-- card No.2-->
<span class="wow-modal-id-2">
 <div class="w3-card-4">
  <p>Some text</p>
 </div>
</span>