Shuffle all DIVS with the same class

Question

What I need done is: Original State: ```

``` After Shuffle: ```

``` The Divs within the first div stay there but get shuffled, and the same happens for the second div with the same class. To shuffle divs inside a specific div I use something like this: ``` function shuffle(e) { // pass divs inside #parent to the function var replace = $('

'); var size = e.size(); while (size >= 1) { var rand = Math.floor(Math.random() * size); var temp = e.get(rand); // grab a random div from #parent replace.append(temp); // add the selected div to new container e = e.not(temp); // remove our selected div from #parent size--; } $('#parent').html(replac…

Accepted Answer

Take a look at this jsfiddle. Essentially what we do is for each of the container `shuffledv` divs we find all children divs and store them in a list, then we remove them from the DOM, e.g.:

```
$(".shuffledv").each(function(){
        var divs = $(this).find('div');
        for(var i = 0; i < divs.length; i++) $(divs[i]).remove();     
```

Then I grabbed the Fisher-Yates shuffling algorithm from here to randomise the list of our divs, and finally we append them back to the parent container, like this:

```
for(var i = 0; i < divs.length; i++) $(divs[i]).appendTo(this);
```

Hope this helps!

Shuffle all DIVS with the same class

Solution

Problem

Related problems