title: Simple drag and drop code
body: <p>Im struggling with seemingly a simple javascript exercise, writing a vanilla drag and drop. I think Im making a mistake with my 'addeventlisteners', here is the code:</p>
  
  <pre><code>var ele = document.getElementsByClassName ("target")[0];
  var stateMouseDown = false;
  //ele.onmousedown = eleMouseDown;
  ele.addEventListener ("onmousedown" , eleMouseDown , false);
  
  function eleMouseDown () {
      stateMouseDown = true;
      document.addEventListener ("onmousemove" , eleMouseMove , false);
  }
  
  function eleMouseMove (ev) {
      do {
          var pX = ev.pageX;
          var pY = ev.pageY;
          ele.style.left = pX + "px";
          ele.style.top = pY + "px";
          document.addEventListener ("onmouseup" , eleMouseUp , false);
      } while (stateMouseDown === true);
  }
  
  function eleMouseUp () {
      stateMouseDown = false;
      document.removeEventListener ("onmousemove" , eleMouseMove , false);
      document.removeEventListener ("onmouseup" , eleMouseUp , false);
  }
  </code></pre>