jQuery- append html using class

Question

I am trying to append html of class and its nested html to another div and only thing available is level-1 for adding elements and nested elements can go upto any level.

When I tried below code, it is not getting appended and throwing below error in console-

Uncaught DOMException: Failed to execute 'appendChild' on 'Node': The new child element contains the parent.

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'));

Alex · Accepted Answer · 2017-03-20 04:19:16Z

1

You forgot to close some divs.

In this code you have 3 unclosed divs, more exactly the first three.

<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>

answered Mar 20, 2017 at 4:19

Alex

4,8077 gold badges42 silver badges60 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

jQuery- append html using class

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related