Howto copy a whole div to another div when javascript is triggered in the div

Question

Hi, I have two columns. People have to select elements from the first column and it will be added to the second column.

I can use innerHTML but I never know how many elements there are going to be. So when I click the link 'MOVE' I would have to know the ID of the element (in the example element1, element2 or element3). Does someone know how I get the parent of the parent div where the javascript triggered?

Like this:

<div id="column1">
  <div id="element1">random tekst 1
      <div id="right">
          <a href="#" onclick="copy()">MOVE</a>
      </div>
  </div>
  <div id="element2">random tekst 2
      <div id="right">
          <a href="#" onclick="copy()">MOVE</a>
      </div>
  </div>
  <div id="element3">random tekst 3
      <div id="right">
          <a href="#" onclick="copy()">MOVE</a>
      </div>
  </div>
</div>

<div id="column2">

</div>

Answer 1

Thanks it works, there is only one little problem.

When I ask: 'elem.parentNode.parentNode.id' I get the correct ID (element2 for example)

But when I ask 'elem.parentNode.parentNode.innerHTML' I get:

<div id="right">
   <a href="#" onclick="copy()">MOVE</a>
</div>

and not

<div id="element2">random tekst 2
      <div id="right">
          <a href="#" onclick="copy()">MOVE</a>
      </div>
</div>

When I add another .parentNode I get the HTML code of all three elements. Does anyone knows how I solve this?