After DOM insertion element is "null"

[Sleeping_Troll]

Here is my script:

$('userPanel').observe('DOMNodeInserted', function(){
  $("EditImage").src="../images/main/Qmark.png";
  $("controlsUpload").innerHTML="<form id='UploadData' name = 'UploadData' action='php/uploader.php' method='post' enctype='multipart/form-data' target='upload_target' ><div ><input id='UploadFile' name='UploadFile' type='file' size=24 onChange = 'StartUpload()'/></div></form>"
});

The DOMNodeInserted event is defined as firing after the insertion, $('EditImage') is an element that was inserted into $('userPanel') however in the reference to it that follows firefox reports "$('EditImage') is null" What's up?
I was thinking it was a matter of timing but javascript is single threaded and I don't see how that can be... or does my browser have something to do with that, but no, because the event does not fire until the DOM insertion is complete... My brain wants to leap out of my skull and run screaming through the streets!

[ohgod]

"DOMNodeInserted
Fired when a node has been added as a child of another node. This event is dispatched after the insertion has taken place. The target of this event is the node being inserted.
Bubbles: Yes
Cancelable: No
Context Info: relatedNode holds the parent node
"

so in theory you ought to be able to include the event in your function and fiddle with that.

$('userPanel').observe('DOMNodeInserted', function(event){
var el = event.element(); 
  el.writeAttribute('src',"../images/main/Qmark.png";
  $("controlsUpload").innerHTML="<form id='UploadData' name = 'UploadData' action='php/uploader.php' method='post' enctype='multipart/form-data' target='upload_target' ><div ><input id='UploadFile' name='UploadFile' type='file' size=24 onChange = 'StartUpload()'/></div></form>"
});