一页上有多个标签块

Question

我正在尝试制作可在页面上重复使用的标签。我已经看到了一个名为tab1的id的示例，其对应于内容id名为tabContent1的位置，但内容将动态加载，因此我无法控制页面上将有多少个选项卡。我有如何通过页面重用html的结构，但不知道如何构建js。最终所有内容选项卡将在页面加载时关闭，然后一旦单击选项卡，它将向下滑动相应的内容。

<div class="tabContainer">
    <div class="tabMenu">
        <div class="tab">Tab 1</div>
        <div class="tab">Tab 2</div>
        <div class="tab">Tab 3</div>
    </div><!-- class="tabMenu" -->
    <div class="tabContent">
        <div class="tabBlock">Tab Content 1</div>
        <div class="tabBlock">Tab Content 2</div>
        <div class="tabBlock">Tab Content 3</div>
    </div><!-- class="tabContent" -->
</div><!-- class="tabContainer" -->

如果必须重新构造html结构，那就没问题了。

非常感谢任何帮助。