Streaming live at 10am (PST)

Drag and drop conditional not working

Hello, I did a drag and drop on Webflow with javascript and some jquery. I added a condition to the drop function but the “else” statement doesn’t seem to work. I want the drag and drop to work with elements of a certain class, so the else statement should display a “try again” message when an attempt is made to drop an element without that class. The else statement seems to be ignored though.

Here’s the read-only link:

And the custom code is something like this.

$(".farmanimal").attr("draggable", "true").attr("ondragstart", "drag(event)");

$("#farm").attr("ondrop", "drop(event)").attr("ondragover", "allowDrop(event)");

function allowDrop(ev) {



function drag(ev) {




function drop(ev) {


    var data = ev.dataTransfer.getData("id");

    var className = ev.dataTransfer.getData("class");

    if (className = "farmanimal") {;

        $("#goodjob").fadeIn().delay(300).fadeOut().css("display", "flex");

    } else {

        $("#tryagain").fadeIn().delay(300).fadeOut().css("display", "flex");



Thanks in advance!