jQueryでHTMLタグ要素をcreateElement使わずに生成する

やりたいこと

とある<form>があってその中にjQueryで動的にinput hiddenタグ要素を生成&追加して送信したい。

要素を生成しようと思ったときにぱっと思いつくのは、document.createElementだが、jQueryを使うと下記のように簡潔にかける。

<form id="targetId">
  ...
</form>

$('<input>').attr({
  type: 'hidden',
  id: 'input_id',
  value: 12345
}).appendTo('#targetId');

また下記のようにattrを使わずに書くことができる（コメントで教えていただきました taku hhara さん、ありがとうございます）。

$("<input>", {
  type: 'hidden',
  id: 'input_id',
  value: 12345
}).appendTo('#targetId');

上述のテクニックを使った下記のようなテキストの入ったdiv要素も生成できます。

$('<div>', { id:'hoge', class:'fuga', text:'piyo' });

このコードは下記コードと同じ結果を得られます。

$('<div id="hoge"><span class="fuga">piyo</span></div>');