Get random, non-repeating items from array

Hello!

I am making a 20-question, multiple choice quiz. Each question is randomly selected from an array, and each time the user clicks on the right answer another randomly-selected question comes up. I haven't been able to figure out how to make it so the questions already selected don't repeat. I have tried pushing the selected items into an array and then using $.grep and an if statement to check if the next randomly selected question is already in the new array or not, but I couldn't seem to get that to work.

My code in the compositionReady panel is:

var arr = ['Symbol_1', 'Symbol_2', 'Symbol_3', 'Symbol_4', 'Symbol_5', 'Symbol_6', 'Symbol_7', 'Symbol_8', 'Symbol_9', 'Symbol_10', 'Symbol_11', 'Symbol_12', 'Symbol_13', 'Symbol_14', 'Symbol_15', 'Symbol_16', 'Symbol_17', 'Symbol_18', 'Symbol_19', 'Symbol_20'];

sym.setVariable("arr", arr);

arr.sort(function() {return 0.5 - Math.random()});

arr.length = 20;

var ques = Math.floor(Math.random()*100)%arr.length;

for (i=0; i<20; i++){

          sym.$(arr[i]).hide();

          sym.$(arr[ques]).show();

};

and each time the correct answer is clicked I run this:

sym.getComposition().getStage().$("try_again1").hide();

sym.getComposition().getStage().$("correct1").show();

sym.getComposition().getStage().getSymbol("correct1").play();

var arr = sym.getComposition().getStage().getVariable("arr");

var ques = Math.floor(Math.random()*100)%arr.length;

for (i=0; i<=20; i++){

sym.getComposition().getStage().$(arr[i]).hide();

sym.getComposition().getStage().$(arr[ques]).show();

}

Any insight into this would be much appreciated!