（新手）如何将一个图像拖到另一个图像上，让第一张图像消失？

Question

新手，使用HTML，CSS和Javascript。目前正在进行一个简单的拖放练习页面，我相信我有拖拽部分（我认为），但我挣扎是因为我的最终目标是让这两个文件图标图像能够拖放到回收站图像（就好像我将它们发送到实际的回收站），并且两个或任一文件图标消失。它并不多，但并不漂亮，但这是我到目前为止的代码：

＆＃13;

＆＃13;

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

function drag(ev) {
  ev.dataTransfer.setData("text", ev.target.id);
}

function drop(ev) {
  ev.preventDefault();
  var data = ev.dataTranfer.getData("text");
  ev.target.appendChild(document.getElementById(data))
  }

＆＃13;

#trash {
  width: 70px;
  height: 70px;
  border: 1px solid black;
}

＆＃13;

<img id="trash" src="trash_can.png" "ondrop"=drop(event)" ondragover="allowDrop(event) ">
    <br>
    <img id="item1 " src="file_icon.png " draggable="true" ondragstart="drag(event) " width="70 " height="70 ">
    <img id="item2 " src="file_icon.png " draggable="true" ondragstart="drag(event) " width="70 " height="70 ">

＆＃13;

＆＃13;

＆＃13;