Changing an items index in an array

Question

I currently have an image sliced up into rectangles and then placed over another image so that I can reveal the image in the back(figure1). I currently have the shapes animating in from left to right and top to bottom(figure2). I want the images to animate in a random way(figure3). Originally I created a position array that I shuffled the values of which created the effect that I want but that obviously also shuffled the image slices. So now I am creating an index array and shuffling the values. I want to swap the sliced images indexes with the new values in the shuffled index array. Splice is not giving the desired effect.

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

    var _s = new createjs.Sprite(this._ss);
        _s.gotoAndStop(i);

    this._container.addChild(_s);

    if((i % 10)===0){
        _ypos += 21;
        _xpos = 34;
    };
    _s.x = _xpos;
    _s.y = _ypos;
    _xpos += 34;

    this._indexArray.push(i);
    this._shapeArr.push(_s);
}

this.shuffleArray(this._indexArray);

for(j=0;j<100;j++){

    this._shapeArr[j]//CHANGE INDEX HERE
}

Answer 1

For anyone else that is trying to do something similar here is the revised code in the second for loop. I found this link which helped me to resolve the issue so check the link out and if you find it helpful then give the guy a +1

Move an array element from one array position to another

 for(j=0;j<100;j++){

    //CHANGED CHILD INDEX HERE
    this._shapeArr.splice(this._indexArray[j],0,this._shapeArr.splice(j,1)[0]);
 }