Please assist, im trying to implement a drag and drop but it doesnt seem to be working. your assistance would be greatly appreciated. 

<div id="div1" draggable="true"  ondragstart="dragStarted(event)"  ondragover="draggingOver(event)" ondrop="dropped(event)" >
<button class="accordions   <%=portletId%>"><%=urlTitle%></button>
<div class="accordionpanel">
 <%=displayArticle.getContent() %>
</div>
</div>

Jascript 

var source;
function dragStarted(evt){
 source=evt.target;
 evt.dataTransfer.setData("text/plain", evt.target.innerHTML);
 evt.dataTransfer.effectAllowed = "move";
}
function draggingOver(evt){
 evt.preventDefault();
 evt.dataTransfer.dropEffect = "move";
}

function dropped(evt){
 evt.preventDefault();
 evt.stopPropagation();
 source.innerHTML = evt.target.innerHTML;
 evt.target.innerHTML = evt.dataTransfer.getData("text/plain");
}