Добавьте div в метках в качестве вспомогательного текста. С каждой радиогруппой и ее оберткой

Question

скриптовая ссылка

Я хочу добавить div в метки в качестве вспомогательного текста. внутри каждой радиогруппы и ее оболочки div.

У меня динамически генерируется код группы радиокнопок, поэтому я не могу добавить статический вспомогательный текст к меткам с использованием HTML.

Я помещаю div подрадиогруппа div и добавление div с вспомогательным текстом и обертывание каждой радиогруппы другим div, затем с помощью append. Я добавляю его единственный вспомогательный текст div к его меткам, используя классы.

до экрана до

После экрана после

<div class="helperTextWrapper" >

<div class="radioTable">
 <div>
    <span>
       <label class="RadioButtonHelperText1">Yes</label>
   </span>
</div>
 <div>
    <span>
       <label class="RadioButtonHelperText2">No</label>
   </span>
</div>
</div>

<div class="RadioButtonHelperTextLabel1">Yes helper text</div>
<div class="RadioButtonHelperTextLabel2">no helper text</div>

</div>

<div class="helperTextWrapper" >

<div class="radioTable">
 <div>
    <span>
       <label class="RadioButtonHelperText1">Yes</label>
   </span>
</div>
 <div>
    <span>
       <label class="RadioButtonHelperText2">No</label>
   </span>
</div>
    <div>
    <span>
       <label class="RadioButtonHelperText3">Not sure</label>
   </span>
</div>
</div>

<div class="RadioButtonHelperTextLabel1">Yes helper text</div>
<div class="RadioButtonHelperTextLabel2">no helper text</div>
<div class="RadioButtonHelperTextLabel3">not sure helper text</div>

</div>

Я хочу добавить вспомогательный текст Да в Да, используя jQuery, как это, но мой скрипт добавляет несколько / дубликаты div:

   $("div.helperTextWrapper ").each(function(index) {

  $(this).find('.RadioButtonHelperTextLabel1').appendTo('.RadioButtonHelperText1');
   $(this).find('.RadioButtonHelperTextLabel2').appendTo('.RadioButtonHelperText2');
    $(this).find('.RadioButtonHelperTextLabel3').appendTo('.RadioButtonHelperText3');

    });


<div class="helperTextWrapper" >

<div class="radioTable">
 <div>
    <span>
       <label class="RadioButtonHelperText1">Yes
           <div class="RadioButtonHelperTextLabel1">Yes helper text</div>
        </label>
   </span>
</div>
 <div>
    <span>
       <label class="RadioButtonHelperText2">No
        <div class="RadioButtonHelperTextLabel2">no helper text</div>
        </label>
   </span>
</div>
</div>

</div>




<div class="helperTextWrapper" >

<div class="radioTable">
 <div>
    <span>
       <label class="RadioButtonHelperText1">Yes
           <div class="RadioButtonHelperTextLabel1">Yes helper text</div>
        </label>
   </span>
</div>
 <div>
    <span>
       <label class="RadioButtonHelperText2">No
        <div class="RadioButtonHelperTextLabel2">no helper text</div>
        </label>
   </span>
</div>
    <div>
    <span>
       <label class="RadioButtonHelperText3">Not sure
        <div class="RadioButtonHelperTextLabel3">not sure helper text</div>
        </label>
   </span>
</div>
</div>

</div>

````

Answer 1

    $(".RadioButtonHelperTextLabel1 ").each(function() {

  $(this).appendTo('.RadioButtonHelperText1');

    });

        $(".RadioButtonHelperTextLabel2 ").each(function() {

  $(this).appendTo('.RadioButtonHelperText2');

    });

            $(".RadioButtonHelperTextLabel3 ").each(function() {

  $(this).appendTo('.RadioButtonHelperText3');

    });
    ```

Answer 2

$("div.radioTable").each(function() {
  $(this).parents(".helperTextWrapper").each(function(index) {
   $(this).find('.RadioButtonHelperTextLabel1').appendTo('.RadioButtonHelperText1');
   $(this).find('.RadioButtonHelperTextLabel2').appendTo('.RadioButtonHelperText2');
    $(this).find('.RadioButtonHelperTextLabel3').appendTo('.RadioButtonHelperText3');
  });
});