Question

I’m dynamically creating divs in my application, and wants through parameters in a function to choose the width and height of the divs. The code below works, however I don’t want to add styling directly to my HTML document which it does.

Is there another way to accomplish this without adding css to the HTML document?

function createDiv(theWidth, theHeight){

var box = $('<div/>', {
   'class': 'box',
   'width': theWidth,
   'height': theHeight,
}).appendTo('#content');

}

Note: The height and width is retrieved from a JSON-file through AJAX and can differ. By that reason I can’t create different classes with different heights and widths.

Answer 1

You can either:

• Add a predefined class to the div, or
• Add a style attribute with the contents

Why “I don’t want to add styling”??

Edit:

function createDiv(theWidth, theHeight){

    $('<div class=\'box\' style=\'width:'+theWidth+'px;height:'+theHeight+'px;\'/>').appendTo('#content');

}