Javascript 添加到div的drop事件（无Jquery）

我正在尝试进行拖放操作，我有一个DINAMICALY生成的表和一个带有垃圾桶的div，因此这些行具有“draggable”属性，但我无法将“drop”元素添加到垃圾桶中

以下是我正在做的：

<div id="tabla" style="margin:30px auto; display:none;">
    <div id="bin" ondrop="drop(event)">
        <img src="icono.png" style="width:100px; margin-left:500px;display:inline;"/><p>
    </div>
    <table id="grid" class="grid">
        <tr>
        <th>Id</th>
        <th>Nombre</th>
        <th>Correo</th>
        <th>Password</th>               
        </tr>
    </table>
</div>

---

您需要在目标元素上启用拖放。向div添加ondragover属性，如下所示：

<div id="bin" ondrop="drop(event)" ondragover="allowDrop(event)">
    <img src="icono.png" style="width:100px; margin-left:500px;display:inline;"/><p>
</div>

<div id="bin" ondrop="drop(event)" ondragover="allowDrop(event)">
    <img src="icono.png" style="width:100px; margin-left:500px;display:inline;"/><p>
</div>

function allowDrop(e) {
    e.preventDefault();
}