title: How to animate object using JavaScript?
body: <p>I want to animate an object (in my example, a div), to move 100px from left to right, using JUST javascript (no JQuery allowed). </p>
  
  <p>Here is my code <a href="http://pastebin.com/HvNjQES0" rel="nofollow">http://pastebin.com/HvNjQES0</a>.</p>
  
  <pre><code>function move(elem) {
      var st = 0;
      console.log("ELEM " + elem);
  
      function animate() {
          st++;
          console.log(st);
          elem.style.left = st + 'px';
          console.log("elem" + elem.style.left);
          if (st == 100) // check finish condition
              clearInterval(id)
      }
      id = setInterval(animate, 10);
  }
  </code></pre>
  
  <p>HTML:</p>
  
  <pre><code>&lt;button onclick="move(text_ex)"&gt;Click&lt;/button&gt;       
  &lt;div id="text_ex" style="width:100px; height:100px; background-color:red"&gt;&lt;/div&gt;
  </code></pre>
  
  <p>What is the problem with my code (it won't work)?</p>
  
  <p>Any other solution is welcomed.</p>