How to set width and height dynamically using jQuery

Question

I would like to set the width and the height of the `div` element dynamically using jQuery. I was trying to replace ```

``` with this: ``` $("#mainTable").css("width", "100"); $("#mainTable").css("height", "200"); ``` but, it does not work for me. Please help to understand why. Thank you all ! The problem was with the quotation marks on numbers. This works fine: ``` $("#mainTable").css("width", 100); $("#mainTable").css("height", 200); ```

Accepted Answer

You can do this:

```
$(function() {
  $("#mainTable").width(100).height(200);
});
```

This has 2 changes, it now uses `.width()` and `.height()`, as well as runs the code on the `document.ready` event.

Without the `$(function() { })` wrapper (or `$(document).ready(function() { })` if you prefer), your element may not be present yet, so `$("#mainTable")` just wouldn't find anything to...well, do stuff to. You can see a working example here.

How to set width and height dynamically using jQuery

Solution

Problem