HTMLマークアップ文字列でクローン要素を挿入するにはどうすればよいですか？

Question

私はdivを複製して別の場所に追加する必要があります。 DIVはこのように見えます。

<div id="clonableContet" class="clonableClass"> 
<input id="Name" class="clonableInput" type="text"/> 
<input id="Age" class="clonableInput" type="text"/> 
</div> 

<div id="clonedContentHolder"></div> 

私はclonableContentのクローンを作成し、clonaedContentHolderでそれを追加した場合、それは前回と同じID が含まれています。クローンされたコンテンツdiv's id属性を動的に変更する必要があります。しかし、クローンされたinput要素に新しいクラス名を動的に追加することができました。私はそれで良いです。私はいくつかのクラス名の参照で値を取得することができます。

しかし、私の問題は、最後にクローン化されたコンテンツを表示させたいということです。これらのすべてがdiv'sのタブの内容なので、 divのIDをclonableContent変更することはできません。

別のdivを動的に作成しようとしましたが、その中にクローンdivを配置しようとしました。その次のように、

var html = "<div id='clonedContent" + count + "'>" + clonedContent + "</div>"; 

は、しかし、出力は、[オブジェクト] [オブジェクト]です。 div内のクローン化されたオブジェクトは、String内のbecamesオブジェクトです。

私はどのように別の文字列として文字列内にclonedContentを挿入しますか？

または、同じ解決策を得るための他の方法がありますか。

ありがとうございます。

Answer 1

のようなhtmlの作成：私が見つけた最良の方法を

html.appendTo('div:last'); 

Answer 2

：次に、あなたはjQueryオブジェクトとしてHTMLを使用してのような最後の項目として追加することができ

var html = $("<div />").attr('id', 'clonedContent'+count).html(clonedContent); 

をこれを行うには、appendに、既存のjQueryオブジェクトへのオブジェクトです：

var html = $("<div id='clonedContent" + count + "' />").append(clonedContent); 

Answer 3

非jQueryのソリュー：

var div = document.createElement("div"); //create a new div 
div.id="clonedContent" + count; // set the id with your counter 
div.appendChild(clonedContent); //add the DOM reference you have 
document.getElementById("clonedContentHolder").appendChild(div); //add the content to div on page