ActionScript 3 - randomly coloured background - problem.

Question

Hello. I use StackOverflow for the first time, so please be friendly and understanding.
Few days ago I got interested in ActionScript. I have downloaded FlashDevelop (a free IDE) and FlexSDK4. Then I have learned the basics from some tutorials.
For now I am not really developing any big project, I'm rather just doing tests.
Anyway, a solution to my problem is really important for me. I have looked for it, but I couldn't find any.
I have just one button and a background in my app. Both the button and the background (below: "bg") are objects of the Sprite class.
When I click the button, the background gets painted with 10x10px squares of random colours. The problem is that the more times I click the button, the longer time I have to wait until the background changes. And that's not all! I can change the background exactly 54 times! At the 55th time it doesn't change at all.

package {
// some imports here

public class Main extends Sprite {
private var button:Sprite;
private var bg:Sprite;

public function Main ():void {
init();
}

private function init (e:Event=null):void {
addChild (bg);
// in the original code there are some lines here,
// in which the button is created
addChild (button);
button.addEventListener (MouseEvent.CLICK, btnClick);
}

private function btnClick (event:MouseEvent):void {
var x:uint, y:uint, color:uint;
for (y=0; y<30; y++) {
for (x=0; x<40; x++) {
color=Math.round(Math.random()*16777215);
bg.graphics.beginFill (color);
bg.graphics.drawRect (x*10, y*10, 10, 10);
bg.graphics.endFill ();
}
}
}
}
}

The code is so short, because I have removed many void lines. I have left only the important ones.
What is wrong with this code? Please help me.
Thanks in advance.

// EDIT: I'm sorry, when I was writing this message, the code seemed to be formatted well. But when I have submitted the message, something went wrong and it does look awful, I know. ;/
I have tried the <pre> tag also, but it also seems not to work properly...

Answer 1

clear your graphics before the loop

 var x:uint, y:uint, color:uint;
 bg.graphics.clear();
 for (y=0; y<30; y++) {//etc