Javascript 向WordPress生成的div动态添加id

我有一个wordpress网站，我正在使用高级自定义字段。现在我在页面上动态生成div，我想做的是为当前具有id=“fader”的每个div插入一个唯一的id，并使用class=“headerBanner”为每个div添加一个唯一的id

我试过几种不同的方法，但都不管用

以下是HTML：

<div class="headerBanner"><img src="http://dev.com/wp-content/uploads/2017/01/Exterior-Constuction_Parallax-1.jpg"></div>
<div class="wrapper-body innerPage">
  <div class="wrap clearfix">
    <div class="col-row clearfix markets" id="fader">
      <div class="col two txtpg">
        <div class="col">
          <h3>Siding</h3>
          <p>Client Name has long been recognized as an industry leader in the siding and vertical cladding market.</p>
          <p>Siding has a solid place in the residential housing market as an aesthetically pleasing and cost-effective solution to protect the house from the elements. Client Name has been at the technological forefront to help siding producers keep &#8211; and grow &#8211; their market share.</p><a class="moreBtn" href="/markets/exterior-construction-outdoor-durable-products/siding/">Read More</a>
        </div>
      </div>
      <div class="imgpg"><img alt="" class="sectionImage" src="http://dev.com/wp-content/uploads/2017/01/Siding-Landing-Page-Image-1.jpg"></div>
    </div>
    <div class="col-row clearfix markets" id="fader">
      <div class="col two txtpg">
        <div class="col">
          <h3>Decking</h3>
          <p>Composite decking has come a long way in its brief two decade history, and Client Name has had a front row seat for the entire ride. What began as product to simply utilize scrap wood and shrink wrap that would have otherwise ended up in a land fill, has evolved into a highly engineered, luxury residential construction product.</p><a class="moreBtn" href="/markets/exterior-construction-outdoor-durable-products/decking/">Read More</a>
        </div>
      </div>
      <div class="imgpg"><img alt="" class="sectionImage" src="http://dev.com/wp-content/uploads/2017/01/Decking-Landing-Page-Image.jpg"></div>
    </div>
  </div>
  <div class="headerBanner"><img src="http://dev.com/wp-content/uploads/2017/01/Exterior-Constuction_Parallax-2.jpg"></div>
  <div class="wrapper-body innerPage">
    <div class="wrap clearfix">
      <div class="col-row clearfix markets" id="fader">
        <div class="col two txtpg">
          <div class="col">
            <h3>Roofing</h3>
            <p>When it comes to roofing, we’ve got you covered.</p>
            <p>In commercial applications, we’ve been making color concentrates for outdoor durable films for over half a century, bringing extensive knowledge and experience to the table. Whether it’s for PVC, TPO, or any other polymer, you can rely on Client Name to maximize the performance and aesthetics of your film.</p><a class="moreBtn" href="/markets/exterior-construction-outdoor-durable-products/roofing/">Read More</a>
          </div>
        </div>
        <div class="imgpg"><img alt="" class="sectionImage" src="http://dev.com/wp-content/uploads/2017/01/Roofing_Landing-Page-Image.jpg"></div>
      </div>
      <div class="col-row clearfix markets" id="fader">
        <div class="col two txtpg">
          <div class="col">
            <h3>Synthetic Turf</h3>
            <p>Artificial, or synthetic, turf is a surface of synthetic fibers made to look like natural grass. Because of recent aesthetic and performance improvements, it is now being used on residential and commercial lawns as well. Artificial turf performs well in heavy foot traffic areas and eliminates the need for irrigation or trimming, cutting down on maintenance and costs.</p><a class="moreBtn" href="/markets/exterior-construction-outdoor-durable-products/synthetic-turf/">Read More</a>
          </div>
        </div>
        <div class="imgpg"><img alt="" class="sectionImage" src="http://dev.com/wp-content/uploads/2017/01/Synthetic-Turf_Landing-Page-Image.jpg"></div>
      </div>
    </div>

---

添加一个递增计数器，以便获得#音量控制器#1、#音量控制器#2、#音量控制器#3，依此类推

if( have_rows('repeater_field_name') ):
$i = 0;
while ( have_rows('repeater_field_name') ) : the_row();
$i++;
echo '<div id="fader_.'$i'.">';
the_sub_field('sub_field_name');
echo '</div>';
endwhile;
else :
// no rows found
endif;

if（有行（'repeater\u field\u name'）：
$i=0；
while（have_rows（'repeater_field_name'））：the_row（）；
$i++；
回声'；
_sub_字段（“sub_字段_名称”）；
回声'；
结束时；
其他：
//找不到行
endif；

请展示您尝试过的一两种方法，并解释不止“无效”。什么不起作用？您已经标记了jQuery—这真的是您想要的方式吗？PHP解决方案会更好吗？一个页面上有四个

id=“fader”

。你知道身份证的用途吗？类的用途是什么？另外，与其使用

id=“String.fromCharCode（97+i）”

为什么不简单地分配/连接索引号呢？id fader是动态添加的，试图使用js更改id名称，但如果这样做，还不如在后端修复它。是否缺少echo“”；在我最初尝试的php中。谢谢不客气。祝你网站的其他部分好运。

if( have_rows('repeater_field_name') ):
$i = 0;
while ( have_rows('repeater_field_name') ) : the_row();
$i++;
echo '<div id="fader_.'$i'.">';
the_sub_field('sub_field_name');
echo '</div>';
endwhile;
else :
// no rows found
endif;