Class firing Improperly on drag

Class firing Improperly on drag

I have a bit of code that I've been working on for a while now and I feel like I'm getting closer, but I'm having an issue when I drag elements from one column to another. The way it works is I have a left and right column. When you drop an item from the left to the right it's supposed to fire an animated class. When I drag my item on the left to the right the image I want is showing up, but when I let go of the mouse button it goes away and animates the original button from the left. What I'm looking for is an if statement something like this.

 

If id = #music then .ondrop change class.


This is the code I'm currently using that is getting me pretty close.


$('#music').droppable({activeClass:'droppedlimusic'});


However I have 7 buttons that are all supposed to fire their own dropped event when dragged.


Here's the JSFiddle for what I have so far.

    • Topic Participants

    • nb420