Question

can you please help me how to add Divs side by side dynamically using Jquery.
Here is my code

$(document).ready(function() {
    $('#idButton').click(function() {
        for (int i = 0; i <= 3; i++) {
            $('body').append('<div id="divId"+'
            i ' style="height:80px;width:80px;background-image:url('
            flashcard1.png ');">Images</div>');
        }
    });
});​

Answer 1

To add it side by side we need float css property.

If you give float:left It will add side by side. Try with float.

Try like this… And make int to var as xdazz stated.

$(document).ready(function() {
    $('#idButton').click(function() {
        for (var i = 0; i <= 3; i++) {
            $('body').append('<div id="divId"+'
            i ' style="height:80px;width:80px;float:left;background-image:url(\'
            flashcard1.png \');">Images</div>');
        }
    });
});​

One more thing after adding float you have to clear it to work the next markup correctly.