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.