I want to dynamically add label and image in my code.When I added label its working fine but when I tried to add image.its not working.
for(var i=0;i<output.length;i++){
var shopname=$("<label id="+output[i].branch_id+">"+output[i].myfavourite+"</label>");
var shopimage=$("<img id="+output[i].image+" float="left" width="100px"/>");
$("#id").append(shopname).append(shopimage);
}
Your quotes in float="left" and width are the issue because you use double quotes to wrap the string. You can escape them like so:
var shopimage=$("<img id="+output[i].image+" float=\"left\" width=\"100px\"/>");
Although you should be setting float in CSS, not as an attribute:
var shopimage=$("<img id="+output[i].image+" width=\"100px\" style=\"float:left\" />");
The whole code would be better working with objects instead of a HTML string:
var shopname = $("<label></label>")
.prop("id", output[i].branch_id)
.text(output[i].myfavourite);
var shopimage = $("<img />")
.prop("id", "someid")
.prop("src", output[i].image)
.css({
width : '100px;',
float: 'left'
});
$("#id").append(shopname).append(shopimage);
src attribute of the image, so nothing will show. Try adding that.
src. Anyway see my edit for a better way.'margin-left' because it contains a special character. Also you didn't include jQuery in the fiddle. Working: jsfiddle.net/2b6LL/1