Не работает Drag'n'drop JS

Задача: есть произвольное количество групп, в каждой группе произвольное количество карточек. Нужно обеспечить возможность перетаскивания карточек в любую из этих групп на любое место среди других карточек, как в Трелло. Я написала следующий код:

defaultCard.draggable = true;
function onDragStart() { 
        this.style.opacity = '0.7'; 
    }
    defaultCard.addEventListener('dragstart', onDragStart, false);
    function onDragEnd() {
        this.style.opacity = '1';
    }
    defaultCard.addEventListener('dragend', onDragEnd, false);
    defaultCard.addEventListener('dragover', function(event){
        event.preventDefault();
    }, false);
    function onDrop(event) {
        event.preventDefault();
        var previousCard = event.path.find(function(node) {
            return node.className === 'card';
        });
        var droppedGroup = previousCard.parentNode;
        var draggableCard = this.defaultCard;
        droppedGroup.insertBefore(draggableCard, previousCard);
    }
    defaultCard.addEventListener('drop', onDrop, false);

Проблема в том, что срабатывают все события, кроме onDrop. Карточки тянутся, применяются стили для подхваченной карточки. Находится место, куда хочу сбросить карточку, но сама карточка не сбрасывается. Что не так?