jQuery- append html using class

Question

私はクラスのhtmlとそのネストされたhtmlを別のdivに追加しようとしています。要素を追加するためのレベル-1とネストされた要素はすべてのレベルまで上がることができます。

私はコードの下にしようとしたとき、それが付加され

コンソール - キャッチされない例外：DOMExceptionに誤りの下投げて取得されていませんが：実行に失敗しました「のappendChild」「ノード」上：新しい子要素は、親が含まれています。

HTML：

<div class="level-1"> 
    <div class="level-2"> 
    <div class="level-3"> 
    aaaaaaa 
     <div class="level-4" style="display:none"> 
     <ul> 
     <li>1</li> 
     <li>2</li> 
     <li>3</li> 

     <ul> 
     </div> 
    </div> 

    </div> 
    <div class="level-2"></div> 
    <div class="level-2"></div> 
</div> 
<div class="level-1"> 
    <div class="level-2"> 
    <div class="level-3"> 
    bbb 
<div class="level-4" style="display:none"> 
     <ul> 
     <li>11</li> 
     <li>22</li> 
     <li>33</li> 

     <ul> 
     </div> 
    <div class="level-2"></div> 
    <div class="level-2"></div> 
</div> 


    <div id="output"></div> 

JS：

$('#output').append($('.level-1')); 

Answer 1

あなたは、いくつかのdivを閉じるのを忘れていました。

このコードでは、未処理のdivが3つ、より正確には最初の3つあります。

<div class="level-1"> 
    <div class="level-2"> 
    <div class="level-3"> 
    bbb 
<div class="level-4" style="display:none"> 
     <ul> 
     <li>11</li> 
     <li>22</li> 
     <li>33</li> 

     <ul> 
     </div> 
    <div class="level-2"></div> 
    <div class="level-2"></div> 
</div>