[JavaScript][jQuery]要素の追加方法まとめ

要素の追加方法をまとめた。
以下、全て div1 エレメントを中心に追加した結果。

<div id="div0">
  <p>０</p>
</div>

<!-- $('#div1').before('<p>追加</p>'); -->
<!-- $('<p>追加</p>').insertBefore($('#div1')); -->

<div id="div1">

  <!-- $('#div1').prepend('<p>追加</p>'); -->
  <!-- $('<p>追加</p>').prependTo($('#div1')); -->

  <p>１</p>
  <div id="div1_1">
    <p>１－１</p>
  </div>
  <div id="div1_2">
    <p>１－２</p>
  </div>

  <!-- $('#div1').append('<p>追加</p>'); -->
  <!-- $('<p>追加</p>').appendTo($('#div1')); -->

</div>

<!-- $('#div1').after('<p>追加</p>'); -->
<!-- $('<p>追加</p>').insertAfter($('#div1')); -->

<div id="div2">
  <p>２</p>
</div>