Javascript 如果存在具有特定类的div，则显示内容

我有一个表格，我有一个iframe，我必须从另一家公司使用，我无法控制更改。我的访问者很难理解表单，我想添加说明，但这很难，因为表单有不同的“页面”或步骤，我只想显示特定步骤的一段说明

我知道这可能是一个长期的机会，但下面是一个例子的形式和我想做什么

<!-- SHOW ONLY IF ID PAGE1 HAS THE CLASS OF CURRENT-PAGE -->
<div class="my-content">My Content</div>

<!-- SHOW ONLY IF ID PAGE2 HAS THE CLASS OF CURRENT-PAGE -->
<div class="my-content">My Content</div>

<!-- SHOW ONLY IF ID PAGE3 HAS THE CLASS OF CURRENT-PAGE -->
<div class="my-content">My Content</div>

<!-- SHOW ONLY IF ID PAGE4 HAS THE CLASS OF CURRENT-PAGE -->
<div class="my-content">My Content</div>

<!-- THIS IS THE FORM -->
<div class="form-name">
   <div class="current-page" ID="page1"> Page 1 questions </div>
   <div class="page" ID="page2"> Page 2 questions </div>
   <div class="page" ID="page3"> Page 3 questions </div>
   <div class="page" ID="page4"> Page 4 questions </div>
</div>

我的内容
我的内容
我的内容
我的内容
第1页问题
第2页问题
第3页问题
第4页问题

---

当我转到下一页时，它会更改div的类，因此第2页不是当前页，并显示新内容。我希望我的div仅在div类为该页面的“当前页面”时显示。

更改页面时，可以执行以下操作：

var currentID = $(".current-page").attr('id');
var page = currentID.substr(4); // skip over "page" prefix
$(".my-content").hide();
$(".my-content").eq(page-1).show();

---

已编辑

使用$.eq（）、$.index（）、$.show（）和$.hide（）

或内联

$('div.my-content').hide().eq($('div.current-page').index()).show();

或者应该是有帮助的。

$('div.my-content').hide().eq($('div.current-page').index()).show();