jQuery - move element and return to its exact previous location?

Question

I'm trying to use jQuery to move an element from one location to another in the DOM. There are elements identical to the originating container alongside it, so how do I store its exact previous location so it will return back to it? Here's an example...

<div class="container"></div>
<ul>
    <li></li>
    <li><div class="move">Content</div></li>
    <li></li>
    <li><div class="move">Content</div></li>
    <li></li>
</ul>

...the "move" divs are individually moving to the "container" div, then back to their previous location on an event via jQuery .appendTo(). How do I ensure each "move" div returns to its exact previous location by detecting where it was moved from (its exact location in the DOM relative to the document, or an otherwise specified parent container)?

EDIT: I have corrected the classes on the divs since the specific case I'm working with has the list items being exact duplicates of one another (structurally), with unique content within their respective elements. Also, the event to move a "move" div back to its original location is a button clicked within it. How does the moved element know where to move back to once moved (specifically, how does it know which list item within the list)?

Answer 1

you can clone them, append them , and finally hide the original div, and in return remove the cloned div and show the original.

Answer 2

Before moving the element, store its .parent() in a variable, then use .append() or .appendTo() to return it when ready.