Как перетаскивать изображения в определенный раздел

Question

Есть некоторая попытка кода на https://codepen.io/anon/pen/dBYwpP

То, что я хочу сделать, это выбрать изображение в верхней части страницы и перетащить его в боковой раздел, заполненный полями, ожидающими, когда изображение будет добавлено туда. Какой способ сделать это? Спасибо!

for (const image of images) {
    image.addEventListener('dragstart', dragStart);
    image.addEventListener('dragend', dragEnd);
}

for (var k = 0; k < empties.length; k++) {
    empties[k].addEventListener('dragover', dragOver);
    empties[k].addEventListener('dragenter', dragEnter);
    empties[k].addEventListener('dragleave', dragLeave);
    empties[k].addEventListener('drop', dragDrop);
}

function dragStart() {
    console.log("dragstart");
    this.className += 'fill';
    setTimeout(() => (this.className = 'invisible'), 0);
}

function dragEnd() {
    this.className = 'fill';
}

function dragOver(event) {
    event.preventDefault();
}

function dragEnter(e) {
    console.log("dragenter");
    e.preventDefault();
    this.className += 'hovered';
}

function dragLeave() {
    this.className = 'empty';
}

function dragDrop() {
    this.className = 'empty';
    this.append(images[5]);
}