Adding Multiple External Images using XML

Hey all,

So I've been having this ridiculous problem for a while now. I'm still an AS3 amateur and now I'm stuck trying to learn that and integrate XML into it. I'm getting the hang of it, but there's this one problem I CANNOT find a solution to, anywhere on the internet for some reason and I've looked through 20 different sites (maybe I'm just thick like that)...

So here's what I'm trying to do:

I have a function that when used, registers an object as a sprite and then applies all sorts of filters to it and allows the user to play around with the object, and they're mainly pictures.

So what I'm trying to do is use XML to tell Flash to load all the images (which are all in the same folder) into flash and "addChild" them to the stage as a movieclip. And everytime I try to do it, I just don't get any output.
Actionscript Code:
var holder:MovieClip = new MovieClip();
var imageArray:Array = new Array();

holder.addChild(imageHolder);
 
//Add the holder to the stage
addChild(holder);
 
var xmlFilePath:String = "pics.xml";
 
//We save the loaded XML data into a variable
var XMLData:XMLList;
 
//Load the XML file.
//We call the xmlDataLoaded() function when the loading is complete.
var loader = new URLLoader();
loader.load(new URLRequest(xmlFilePath));
loader.addEventListener(Event.COMPLETE, xmlDataLoaded);
 
//This function is called when the XML file is loaded
function xmlDataLoaded(e:Event):void {
 
    //Create a new XML object from the loaded XML data
    XMLData = new XMLList(loader.data);
    XMLData.ignoreWhitespace = true;
    holder.visible = false;

    for each (var image:XML in XMLData.pics.image) {
            //Load the image (the image path is specified in the XML)
            var imageLoader = new Loader();
            imageLoader.load(new URLRequest(image.fpath));
 
            //Listen when the image is loaded
            imageLoader.contentLoaderInfo.addEventListener(Event.COMPLETE, imageLoaded);
    }
}

//This function is called when the image is loaded
function imageLoaded(e:Event):void {
    var temp:MovieClip = new MovieClip();
    //We can set the holder visible again now that the image is loaded
    holder.visible = true;
 


 
    //Remove the previous image from the image holder if there is one
    if(imageHolder.numChildren > 0) {
        imageHolder.removeChildAt(0);
    }
 
    //Add the loaded image to the image holder
    imageHolder.addChild(e.target.content);
    temp.addChild(e.target.content);
    stage.addChild(temp);


}
where imageHolder is an empty mc inserted in the first frame.

Here's my XML

Code:

<?xml version="1.0" encoding="utf-8"?> <site> <pics> <Image> <fpath>Images\1.jpg</fpath> </Image> <Image> <fpath>Images\2.jpg</fpath> </Image> <Image> <fpath>Images\3.jpg</fpath> </Image> </pics> </site>

If anyone can think of a better way to do this (which I'm 100% confident that you can because man do I have a lot to learn), I would seriously appreciate it you have no idea.