Code working in online code editor, but not locally
<p>I have written a bit of code to increase the size of an image. I copy and pasted the code into a online w3 code editor and the code works as expected.
When I run the <strong>exact</strong> code locally in any web browser it does not work...</p>

<p>If I put any <code>alert()</code> inside it, it works, but the image size does not change at all.</p>

<p>Any idea why?</p>

<p>See the below snippet:</p>

<p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>function zoom(){
  var element = document.getElementById("myImg");
  var newHeight = 150;
  var newWidth = 450;
  var zoomStart = function(){
      element.width += 1;
      element.height += 1.5;
      if(element.height &lt; newHeight){
          setTimeout(zoomStart, 10);
      }    
   }

  zoomStart();
  }</code></pre>
<pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;img id="myImg" src="local_image.jpg"&gt;
&lt;button onclick="zoom()"&gt;Try it&lt;/button&gt;</code></pre>
</div>
</div>
</p>

<p>EDIT:</p>

<p>It seems that if I set the image size in a separate css file, the image stops resizing. But if I use inline css to style the image it resizes properly...</p>