【jQuery】formを擬似的に作ってsubmitさせたいが、要素の追加ができない

Question

質問概要

jQuery（3.2.1）を使って、コード内に擬似的にformを作りPOSTしたい。

質問

http://qiita.com/dolaemoso/items/acfeb1df3b2e096d09cb
上記ページを参考に、コード内にjQuery(3.2.1)を使い、formを作成してpostしたいと考えております。
しかし、

$('<form>', {action: "post.php", method: 'post'})
.append($('<input>', {type: 'hidden', name: 'param', value: 'submitdata'}));

のようにすると、フォームのデータの値が以下のように付与されます。

しかし、次のようにコードを書くと、input中に要素が入りません。

console.log(data);
console.log(url);
// 擬似的なフォームを作成する
var dummy_form = $('<form>', {action: url, method: 'post'});

// 与えられたdataをtype="hidden"でフォームに埋め込む
for( var key in data ){
    dummy_form.append('<input>', {type: 'hidden', name: key, value: data[key]});
}

console.log(dummy_form);

これはなぜなのでしょうか？
理由がわからず困っております。

なお、検証に使っているブラウザは、
Firefox Developer Edition56.0b1 (64 ビット)です

ご存じの方がいらっしゃいましたら、ご教示いただけますと幸いです。
よろしくお願いいたします。

Answer 1

.append()は無制限に引数をとれるメソッドです。

    dummy_form.append('<input>', {type: 'hidden', name: key, value: data[key]});

この書き方では、第一引数で属性なしのinputタグを作り、第二引数でオブジェクトを追加しろという指示を無視しています。
つまり、最初の書き方どおり、$()でまずjQueryオブジェクトにしてから.append()すればいいのです。

    dummy_form.append($('<input>', {type: 'hidden', name: key, value: data[key]}));

Comments

[nnahito]

ご回答ありがとうございます！

jQueryオブジェクトにすれば、無事データが挿入されました！！