create a span and inject image to it

I am new to mootools. What I want is to create a new element span and inject an image to it.

I wrote the following code but doesn't work:

var newElementVar = new Element('span', {
  'id': 'id_namekhan',
  'text': 'I am a new div'
}); 
var my_img = new Element ('img' , {
  'src' :'uploading/'+json.get('fpath')+'' , 
  'style' : 'width:50px; text-align:left' 
}).inject(id_namekhan, 'top');

Even the t开发者_运维知识库ext 'I am a new div' is not showing.

Thanks

Your problem is that you are trying to inject the image into the span using its ID, but the span hasn't been added to the page (DOM tree) yet. Try this:

var my_span = new Element('span', {'id': 'id_namekhan','text': 'I am a new div'});
var my_img = new Element ('img' , {'src' :'uploading/'+json.get('fpath')+'' , 'style' : 'width:50px; text-align:left' }).inject(my_span, 'top');
my_span.inject($('element')); // replace element with the ID of the element you wish to inject the span inside