javascript - 循环append方法

Question

我想循环往p中添加dom

<p class="svg-container"></p>
<p class="svg-container"></p>
<p class="svg-container"></p>

JS代码：

$(".svg-container").each(function() {
    $(this).append(doc);
}

但是只有最后一个p添加了，我试着用for循环写了也是一样。是什么原因呢？~求大神解答谢谢~

---

感谢各位的回答，其实我的doc的值是随机的
问题应该是这个，clone的方法应该要当doc是相同的元素才可以

$(".svg-container").each(function() {
    doc=Math.random();//打个比方，其实这里的doc是svg文件
    $(this).append(doc);
}

提问的时候太想当然了以为这里的随机应该和添加没关系，抱歉抱歉~

---

。。。底下的回答是可以解决的。。。是我写错了 我的锅！

Answer 1

append添加到元素的时候，已存在的元素是移动而不是复制，你用了遍历，所以第一次是新增，后面都是移动前面新增的，最后当然就出现了只有最后一项有东西。
解决办法：
1、不要遍历，你用的是jQuery的类选择器，可以直接$(".svg-container").append(doc),它会自动复制多份保存append进去
2、遍历的时候手动复制一份，$(this).append(doc.clone())
3、doc改成字符串

Answer 2

同一个 DOM 添加到某个位置的时候，会从前一个位置移除，所以你需要 clone

$(".svg-container").each(function() {
    $(this).append(doc.clone());
}

Answer 3

$(".svg-container") 要历遍

$.each($(".svg-container"), function() {

        $(this).append('doc');
    });