Need help cloning first child to 2nd parent

Hi Mate,

Please help me solve this problem.

here is jfiddle:
https://jsfiddle.net/11oLbzf6/

I need to copy the first div child to the 2nd mother using clone.

The first mother can have multiple children and i only want to get the first child and put it into the 2nd mother, then when on the second mother it can be clone again to produce multiple children.

Thank you in advance.

Neil

 

Hi Neil. For your specific structure:

<div class='mother'>
mother1
    <div class='child'>
      child1
    </div>
  
     <div class='child'>
    child2
    </div>

</div>
<hr>
<div class='mother2'>
mother2
</div>

<button>
Copy first child to mother 2
</button>

HTML:

you may want to try a way below:

var button = document.getElementsByTagName('button')[0],
   buttonClickHandler = function(){
     var children = document.getElementsByClassName('child'),
          childClone = children[0].cloneNode(true),
          mother2 = document.getElementsByClassName('mother2')[0];
     mother2.appendChild(childClone);
  };
button.addEventListener('click', buttonClickHandler, false);

Code (JavaScript):

 

Thank you mate,.

I will try..

 

You're welcome.