title: JavaScript Drag and Drop not working on iPad
body: <p>I have this drag and drop code, which works well except on iPads, can anyone give any reason why? </p>
  
  <p>It seams as though it can't recognise the fact it can be dragged as opposed to anything else</p>
  
  <p><a href="http://jsfiddle.net/3Nxxa/" rel="nofollow">JS Fiddle</a></p>
  
  <pre><code>&lt;span class="draggable" id="drag1" draggable="true" ondragstart="drag(event)"&gt;drag&lt;/span&gt;
  &lt;span class="draggable" id="drag2" draggable="true" ondragstart="drag(event)"&gt;drop&lt;/span&gt;
  &lt;br /&gt;
  This is a sample 
  &lt;div id="div1" ondrop="drop(event)" ondragover="allowDrop(event)"&gt;&lt;/div&gt;
  and 
  &lt;div id="div2" ondrop="drop(event)" ondragover="allowDrop(event)"&gt;&lt;/div&gt;
  sentence.
  </code></pre>
  
  <p>JavaScript:</p>
  
  <pre><code>function allowDrop(ev){
          ev.preventDefault();
        }
        function drag(ev){
          ev.dataTransfer.setData("Text",ev.target.id);
        }
        function drop(ev){
          ev.preventDefault();
          var data=ev.dataTransfer.getData("Text");
          ev.target.parentNode.replaceChild(document.getElementById(data), ev.target);
          document.getElementById(data).className = "";
        }
  </code></pre>