Remove child before adding one in its place

Hi,
I’m trying to do my best teaching myself programming, but it is taking me all day to figure this out, even after surfing threads about adding and removing children. I am a coach and want to use this drawing app for the kids. I have three different mc’s that have drawing code in them. Each movie clip has a different canvas in it. One is blank, one looks like a soccer field, One looks like a gym, and the other looks like a basketball court. Its for drawing players and plays. On the main stage I have three thumbnails of the canvas’. What I would like to do, is when you click on the thumbnail, it adds that specific movie clip to the stage. When another thumbnail is clicked, I would like it to check and remove one if it is there, and then add the new canvas to the stage (for performance). I also have an exit button to clear the child in the 0 index which is where I addChild. I think I’m using indexes in a bad way! Im sure my code is rough around the edges but here it is. Even if I need to work with a new idea, I would love your help problem solving this!

Thanks
Josh

[TABLE=“class: outer_border, width: 500, align: left”]
[TR]
[TD]
import flash.display.SimpleButton;

//Adds functionality to the exit button
exit.visible = false;
exit.addEventListener(MouseEvent.CLICK, closePaint);

function closePaint(evt:MouseEvent):void
{
removeChildAt(0);
exit.visible = false;
}

//adds event listeners to the sketchpad thumbnails
blank.addEventListener(MouseEvent.CLICK, blankSketch);
gym.addEventListener(MouseEvent.CLICK, gymSketch);
goal.addEventListener(MouseEvent.CLICK, goalSketch);
basketball.addEventListener(MouseEvent.CLICK, basketSketch);

//creates function for sketch pad thumbnails
function blankSketch(evt:MouseEvent):void
{
var blankSketch:mc_sketchPadBlank = new mc_sketchPadBlank;
blankSketch.x = 152;
blankSketch.y = 156;
blankSketch.width = 674;
blankSketch.height = 503;
blankSketch.name = “blankSketch”;
addChildAt(blankSketch, 0);
exit.visible = true;
for( var i:uint = 0; i < numChildren; i++){ trace(getChildAt(i).name + i) }
}
function gymSketch(evt:MouseEvent):void
{
var gymSketch:mc_sketchGym = new mc_sketchGym;
gymSketch.x = 152;
gymSketch.y = 156;
gymSketch.width = 674;
gymSketch.height = 503;
gymSketch.name = “gymSketch”;
addChildAt(gymSketch, 0);
exit.visible = true;
for( var i:uint = 0; i < numChildren; i++){ trace(getChildAt(i).name + i) }
}
function goalSketch(evt:MouseEvent):void
{
var goalSketch:mc_sketchGoal = new mc_sketchGoal;
goalSketch.x = 152;
goalSketch.y = 156;
goalSketch.width = 674;
goalSketch.height = 503;
goalSketch.name = “goalSketch”;
addChildAt(goalSketch, 0);
exit.visible = true;
for( var i:uint = 0; i < numChildren; i++){ trace(getChildAt(i).name + i) }
}
function basketSketch(evt:MouseEvent):void
{
var basketSketch:mc_sketchBasket = new mc_sketchBasket;
basketSketch.x = 152;
basketSketch.y = 156;
basketSketch.width = 674;
basketSketch.height = 503;
basketSketch.name = “basketSketch”;
addChildAt(basketSketch, 0);
exit.visible = true;
for( var i:uint = 0; i < numChildren; i++){ trace(getChildAt(i).name + i) }
}

[/TD]
[/TR]
[/TABLE]