title: Create new layer every time a button is clicked
body: <p>I have the following code to allow the user to load an image onto the stage from their computer and this image is then placed into a new Sprite layer:</p>
  
  <pre><code>var imageBrowse:FileReference = new FileReference();
  
  BrowseButton.addEventListener(MouseEvent.MOUSE_DOWN, loadImage);
  function loadImage(e:MouseEvent):void{
      imageBrowse.browse([new FileFilter("Images", "*.jpg;*.png")]);
      imageBrowse.addEventListener(Event.SELECT, fileSelected);
  }
  
  function fileSelected(e:Event):void{
      imageBrowse.addEventListener(Event.COMPLETE, imageLoaded);
      imageBrowse.load();
      imageBrowse.removeEventListener(Event.SELECT, selectedFile);
  }
  
  function imageLoaded(e:Event):void{
      var imageLoader:Loader = new Loader();
      imageLoader.loadBytes(e.target.data);
      imageLayer.addChild(imageLoader);
      imageLoader.x = 375;
      imageLoader.y = 175;
      imageBrowse.removeEventListener(Event.COMPLETE, imageLoaded);
  }
  </code></pre>
  
  <p>How would I go about coding it so that every time an image is uploaded (by clicking the <code>BrowseButton</code>) the image is added to a new <code>Sprite</code> layer (Perhaps <code>imageLoader1</code>, <code>imageLoader 2</code>, could be the names of the layers for exmaple). I'm just not sure how to loop through and create a new Sprite layer for each time an image is actually uploaded or if it's even possible.</p>
  
  <p>Obviously the way I have it at the minute is that any uploaded image is placed onto the same layer and in the same place, meaning more than one image uploaded ends up with the images just stacked on top of each other as one 'image', unable to move them independently.</p>
  
  <p>Any help will be appreciated. Thanks for any replies.</p>