javascript - 使用类选择器进行jQuery拖放

这对专家来说一定很简单。我是JS/jQuery新手。我有一个脚本来拖动和复制，我根据我的要求修改了它。它是用“id”选择器实现的。我想用“类”选择器实现同样的功能。
这里是fiddle demo

$(document).ready(function(){
$('#arsenal').on("dragstart", ( function (e) {
    e.originalEvent.dataTransfer.setData("Text", e.target.id);
}));

$('#leftbox').on("dragenter", ( function (e) {
    e.preventDefault();
}));

$('#leftbox').on("dragover", ( function (e) {
    e.preventDefault();
}));

$('#leftbox').on("drop", ( function (e) {
    e.preventDefault();
    $(this).empty();
    var data=e.originalEvent.dataTransfer.getData("Text");
    var nodeCopy = document.getElementById(data).cloneNode(true);
    nodeCopy.id = "newId";
    e.target.appendChild(nodeCopy);
}));

});

说明：
我有一个需求，我需要为一组动态添加（使用JS）的图像实现这个。所以我不能使用目标图像的Id。我需要上课。我试过了，但没能成功。
有人能帮我吗？
提前谢谢你，

最佳答案

Here's a basic JSFiddle of what you're doing using classes.
这几乎是一个改变你的选择的问题：

$('.draggableImg').on("dragstart", ( function (e) {
    ...
});

还有一个小问题——如果您将图像拖到了leftbox，然后将图像拖到leftbox中的leftbox。。。你会得到一个错误。（将图像复制到removeClass后，您可能只需要leftbox）。
另外，如果你说你的元素没有ID。。。然后需要传递图像的实际源，而不是元素ID。
并且updated fiddle which does that一个你总是附加到框，而不是目标（可能是刚刚被清除的img）！