【jquery】要素を追加するメソッドのメモ

たまに使うんだけど、どこに追加されるのか覚えてないから備忘録

jQueryの要素を追加するメソッド

// html

<div id="content">
	<div>テキスト</div>
</div>

// jQuery

<script>
jQuery(function($){
	//要素の直前に追加
	$('#content').before('<div>.before()</div>');
	$('<div>.insertBefore()</div>').insertBefore('#content');
	//要素内の先頭に追加
	$('#content').prepend('<div>.prepend()</div>');
	$('<div>.prependTo()</div>').prependTo('#content');
	//要素内の最後に追加
	$('#content').append('<div>.append()</div>');
	$('<div>.appendTo()</div>').appendTo('#content');
	//要素の直後に追加
	$('#content').after('<div>.after()</div>');
	$('<div>.insertAfter()</div>').insertAfter('#content');
});
</script>

// 出力結果

<div>.before()</div>
<div>.insertBefore()</div>
<div id="content">
	<div>.prependTo()</div>
	<div>.prepend()</div>
	<div>テキスト</div>
	<div>.append()</div>
	<div>.appendTo()</div>
</div>
<div>.insertAfter()</div>
<div>.after()</div>