Help deleting a movie clip from a scroll pane

I currently have two movie clips (test & test2) that upon button release (button & button2) I am loading into a scrollpane (scrollPane). (For testing purposes I load each clip several times, but in the final product I will have up to 10 different movie clips & buttons the user can load into the scrollPane.) On each of the movie clips I have a delete button (btnDelete). I also have an additional delete button on the main page called btnRemove. When the two movies are loaded into the scroll pane I can click the btnRemove button and the last clip I loaded will be deleted, then if I click it again the one above it will be deleted, etc. - so it works that way. However, I would like the user to be able to click on the delete button (btnDelete) that goes with the specific movie clip they would like to delete-not just the last one that was loaded.
I have this action on the btnDelete within the test movieclip:


on (press) {
this.removeMovieClip("test");
}

I have this action on the btnDelete within the test2 movieclip:

 
on (press) {
this.removeMovieClip("test2");
}

It did remove each movie clip but left a space where they used to be. If I tried to load the movieclips again it would go below the white space. What I want is once the specific clip is deleted, everything below it will shift up and replace the deleted clip.

Could anyone take a look at the script I have so far and give me any ideas on how I might accomplish this. I know I am missing something that I am hoping someone with more experience will get. Thanks!

  
var i:Number=0; 
var mcMain:MovieClip; 
 
function init() { 
//empty movie clip in library with linkage name "scrollMovieClip" 
scrollPane.contentPath = "scrollMovieClip"; 
mcMain = scrollPane.content; 
trace(mcMain); 
} 
init(); 
 
scrollPane._visible = false;
textBox._visible = false;
btnClose._visible = false;
backBox._visible = false;
 
button.onRelease = function() { 
//attaching blueMovie to the content location stored in mcMain 
mcMain.attachMovie("test", "blue"+i, mcMain.getNextHighestDepth(), {_y:62*i+5, _x:5}); 
i++; 
scrollPane.invalidate();
};
 
button2.onRelease = function() { 
//attaching blueMovie to the content location stored in mcMain
mcMain.attachMovie("test2", "blue"+i, mcMain.getNextHighestDepth(), {_y:62*i+5, _x:5}); 
i++; 
scrollPane.invalidate();
};
 
btnRemove.onRelease = function() { 
if (i != 0) { 
i--; 
removeMovieClip(mcMain+".blue"+i); 
scrollPane.invalidate(); 
} 
}