Swapping Two Divs with Javascript
<p>I have a bunch of floating divs in a box arranged as follows:</p>

<p><a href="https://i.stack.imgur.com/DrBUW.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/DrBUW.png" alt="9 divs of boxes floating in aother div"></a></p>

<p>The HTML is simple, and looks something like this:</p>

<pre><code>&lt;div class="square"&gt;0&lt;/div&gt;
&lt;div class="square"&gt;1&lt;/div&gt;
&lt;div class="square"&gt;2&lt;/div&gt;
</code></pre>

<p>Each box has events and other properties on it, and I am having trouble swapping two divs with each other (e.g. 7 and 8, or 1 and 4, etc). I have tried an approach like this (where id1 and id2 are the indexes of the two divs being swapped):</p>

<pre><code>var temp = box.children[id1];
area.children[id1] = box.children[id2];
area.children[id2] = temp;
</code></pre>

<p>But this yields no results. Any help would be appreciated!</p>