# addChild and removeChild with MouseEvent

**URL:** <https://forum.kirupa.com/t/addchild-and-removechild-with-mouseevent/324918>\
**Category:** flash\
**Created:** [September 15, 2011, 8:18pm UTC](https://forum.kirupa.com/t/addchild-and-removechild-with-mouseevent/324918 "2011-09-15T20:18:32Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![Joufu](https://avatars.discourse-cdn.com/v4/letter/j/a4c791/32.png) [@Joufu](https://forum.kirupa.com/u/Joufu)\
**Post date:** [September 15, 2011, 8:18pm UTC](https://forum.kirupa.com/t/addchild-and-removechild-with-mouseevent/324918/1 "2011-09-15T20:18:32Z")

</div>

[COLOR=#000000]Hello, I am a newby at AS3. I need help with addChild and removeChild.  
I want to make a two buttons one addChild and other removeChild . Friend helped me a little bit, but I didnt uderstand the script ;]  
Here is the example script which my friend gave to me. In other words I want to make a button that attached hair and the other that removes.  
Should I make a separete custom class for Hair? And if do, can someone help? :]

> public function changeHairs(newHair:Hair):Hair  
> {  
> Face.removeChild(oldHairs);  
> oldHairs = newHair;  
> Face.addChild(newHair);

```
		return newHair;
	}

```

Or modify this code

> package {

```
import flash.display.MovieClip;

```

[/COLOR][COLOR=#000000] import Button;[/COLOR][COLOR=#000000]   
import flash.text.TextField;  
import flash.events.MouseEvent;

```
public class Faces2 extends MovieClip 
{
	public var arr:Array = new Array(a1,a2,a3);
	trace("aab");
	public var txt:TextField = new TextField()
	public var btnBack:Button = new Button();
	public var btnFwd:Button = new Button();
	
	public var arrPos:Number = 0;
	
	public function Faces2() 
	{
		setupInterface();
		setupData(arrPos);
	}
	
	public function setupInterface():void
	{
		btnBack.x = 100; btnBack.y = 10;
		btnFwd.x = 200; btnFwd.y = 10;
		
		btnBack.addEventListener(MouseEvent.CLICK, back);
		btnFwd.addEventListener(MouseEvent.CLICK, fwd);
		
		addChild(btnBack); 
		addChild(btnFwd);
		
		txt.textColor = 0xFF0000;
		txt.width = 300;
		txt.border = true;
		txt.x = 100; txt.y = 100;
		
		addChild(txt)
	}
	
	public function fwd(evt:MouseEvent):void
	{
		arrPos ++;
		if(arrPos &gt;= arr.length) 
		{
			arrPos = 0;
		}
		setupData(arrPos); 
	}
	
	public function back(evt:MouseEvent):void
	{
		arrPos --;
		if(arrPos &lt; 0) 
		{
			arrPos = arr.length - 1;
		}
		setupData(arrPos);
	}
	
	public function setupData(pos:Number):void
	{
		txt.text = arr[pos];
	}

```

[/COLOR][COLOR=#000000] }[/COLOR][COLOR=#000000]

}

P.S. sorry for my english

[COLOR=#000000][/COLOR]  
[/COLOR]