Create an image tag dynamically with jQuery!

Create an image tag dynamically with jQuery!

by Ismail Ibraheem Shurrab

HTML

<button id="mybutton">Create an image tag dynamically with jQuery!</button>

<div id="container">
</div>

CSS

button {
    width:300px;
    height:50px;
}

img {
    border:6px outset rgb(0,100,255);
    margin:3px;
}

JavaScript

$(document).ready(function() {
    
    var img_index = 1;

    $('#mybutton').click(function() {
        var img = $('<img />').attr({
            'id': 'myImage'+img_index,
            'src': 'http://doc.jsfiddle.net/_downloads/jsfiddle-logo.png',
            'alt': 'JSFiddle logo',
            'title': 'JSFiddle logo',
            'width': 250
        }).appendTo('#container');
        
        img_index++;
    });
});