请老司机帮忙看一下，下面代码目的是将若干元素重复插入到一个容器中，似乎不太灵。
1、插入的多个元素为什么只显示2个？
2、后插入的p2，为什么反而在p1前面？
谢谢您的解答，3Q感谢。
<body>
<div id="box-wrap">
<h1>这是h1</h1>
</div>
<script src="js/jquery-2.1.0.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
var p1 = $("<div class='box'>p1</div>");
var p2 = $("<div class='box'>p2</div>"); //▲准备两个元素，稍后插入到容器中。
//▼开始插入到容器中，但为什么这么多，只插入了2个？
$("#box-wrap").append(p1);
$("#box-wrap").append(p2);
$("#box-wrap").append(p1);
$("#box-wrap").append(p1);
$("#box-wrap").append(p1); </script>
</body>相关分类