将复选框和标签附加到div

Question

我的html结构就像这样

<div class="checkbox">
  <label><input type"checkbox">First</label>
</div>
<div class="checkbox">
  <label><input type"checkbox">Second</label>
</div>
<div class="checkbox">
  <label><input type"checkbox">Third</label>
</div>

我正试图让它像这样

<div class="checkbox">
  <input type"checkbox">
  <label>First</label>
</div>
<div class="checkbox">
  <input type"checkbox">
  <label>Second</label>
</div>
<div class="checkbox">
  <input type"checkbox">
  <label>Third</label>
</div>

我试过这个

$(":checkbox")
.prependTo(".checkbox");

但它会将所有复选框附加到所有div

更新：  我想使用JavaScript更新我无法控制HTML

Answer 1

试试这个： -

<script>
document.getElementsByClassName("checkbox")[0].innerHTML="<input type='checkbox'><label>First</label>";
document.getElementsByClassName("checkbox")[1].innerHTML="<input type='checkbox'><label>Second</label>";
document.getElementsByClassName("checkbox")[2].innerHTML="<input type='checkbox'><label>Third</label>";