Change width and height using Javascript
<p>I am currently working on a simple task, changing the width and height of a div id using javascript. This is my code and I just can't get it to work. Is there something I'm forgetting to add?</p>

<p>HTML:</p>

<pre><code>&lt;!doctype html&gt;
&lt;html&gt;
&lt;head&gt;
&lt;/head&gt;
&lt;body&gt;

&lt;div id="box"&gt;
    Hello!
&lt;/div&gt;

&lt;script src="main.js"&lt;/script&gt;
&lt;/body&gt;
&lt;/html&gt;
</code></pre>

<p>Javascript:</p>

<pre><code>function changeSize() {
document.getElementById('box').setAttribute("style","display:block;width:300px;background-color:blue;");
document.getElementById('box').style.width='300px';
}
</code></pre>