How to "shuffle" multiple Divs?

Question

I am making a script for a quiz, and would like to "shuffle" the Divs with the "Question" class within the Divs with the "q" class. so that the questions were random. I did not find any way to do this, so I ask for help Prfv.

HTML

<section>
    <article class="q" id="questao1">
        <div class="question">

        </div>
    </article>
    <article class="q" id="questao2">
        <div class="question">

        </div>
    </article>
    <article class="q" id="questao3">
        <div class="question">

        </div>
    </article>
    <article class="q" id="questao4">
        <div class="question">

        </div>
    </article>
    <article class="q" id="questao5">
        <div class="question">

        </div>
    </article>
    <article class="q" id="questao6">
        <div class="question">

        </div>
    </article>
    <article class="q" id="questao7">
        <div class="question">

        </div>
    </article>
    <article class="q" id="questao8">
        <div class="question">

        </div>
    </article>
    <article class="q" id="questao9">
        <div class="question">

        </div>
    </article>
    <article class="q" id="questao10">
        <div class="question">

        </div>
    </article>
    <article class="q" id="resultado">

    </article>
</section>

Answer 1

I found this example here http://jsfiddle.net/BwJHj/1/ I applied in your code, see below if this meets you.

var cards = $(".q");
for(var i = 0; i < cards.length; i++){
    var target = Math.floor(Math.random() * cards.length -1) + 1;
    var target2 = Math.floor(Math.random() * cards.length -1) +1;
    cards.eq(target).before(cards.eq(target2));
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<section>
    <article class="q" id="questao1">
        <div class="question">
        questao1
        </div>
    </article>
    <article class="q" id="questao2">
        <div class="question">
        questao2
        </div>
    </article>
    <article class="q" id="questao3">
        <div class="question">
        questao3
        </div>
    </article>
    <article class="q" id="questao4">
        <div class="question">
        questao4
        </div>
    </article>
    <article class="q" id="questao5">
        <div class="question">
        questao5
        </div>
    </article>
    <article class="q" id="questao6">
        <div class="question">
        questao6
        </div>
    </article>
    <article class="q" id="questao6">
        <div class="question">
        questao6
        </div>
    </article>
    <article class="q" id="questao8">
        <div class="question">
        questao8
        </div>
    </article>
    <article class="q" id="questao9">
        <div class="question">
        questao9
        </div>
    </article>
    <article class="q" id="questao10">
        <div class="question">
        questao10
        </div>
    </article>
    <article class="q" id="resultado">

    </article>
</section>

Origin: https://stackoverflow.com/questions/18483241/random-div-order-on-page-load