One of my revert objects for drag n drop with function is half way wrong in Adobe Edge Animate

Question

I applied the answer here for revert on this thread (Adding a function to jQuery draggable revert "event") but I still have a problem. When placed in the wrong drappable, the manager icon for some reason instead of reverting to its place, just hides and shows the correct icon where it would if it did not revert and was correct. The feedback is wrong which is which is what should be. All the others do revert and show feedback as expected if I place them in the wrong droppable. This is strange that one would act differently. All the correct ones do what they are supposed to do. The setup: I have a long background with icons which is movable with keydown events. On the top I have a (fixed) bar with the droppables and hidden icons that will appear on correct draggable while the actual draggables will hide. This is because otherwise the draggables would move with the background since if is a different div than the bar where the droppable are.
Hope this makes sense.

var icons = ['GOALS','CUSTOMER','MANAGER','PRODUCT','PRICE','DELIVER','BALANCE'];

for(j=0;j<icons.length;j++){    
    sym.$(icons[j]).addClass('drag'+j);  
     // each draggable corresponds to a droppable 
     // by class name indexed
    sym.$('.drag'+j).draggable({    
        revert: function(obj){
            if(obj===false){                
                // add feedback screen and sound and revert icon
                sym.$('wrong').attr('src',"images/wrongSpot.png");  
                sym.$('wrong').animate({'top': 23},1000);       
                sym.$("incorrectFX")[0].play();         
                return true;
            }else{
                return false;
            }// end if else statement           
        }// end revert
    });// end draggable

    sym.$('d'+j).droppable({
        accept: ".drag"+j,
        drop: dropEvent
    }); // end droppable
} // end for loop

k = 0;
function dropEvent(event, ui){
    ui.draggable.position( { of: $(this), my: 'center', at: 'center' } );
    ID = ui.draggable.attr("id").replace('Stage_','');
    console.log('this is the id name: ' + ID);
    sym.$('wrong').animate({'top': 23},1000);
    // replace wrong image with goodJob image since it is correct
    sym.$('wrong').attr('src',"images/goodJob.png");    
    if (music.paused ) {
        sym.$("correctFX")[0].pause();  
    } else {
        sym.$("correctFX")[0].currentTime = 0;
        sym.$("correctFX")[0].play();
    } 
    // since the droppable area is independant of the bg which move
    // I implemented a substitute icon in the fixed area
    sym.$(""+ID+"Copy").css({'opacity':1.0});  // show icon on the bar
    sym.$(""+ID+"").css({'opacity': 0});       // hide the draggable icon
    // count the number of correct to show feedback
    k++;
    if(k==7){   
        sym.$('complete').animate({"left":0},700);
        sym.$("completionFX")[0].play();
        sym.$('wrong').animate({'top':450},1000);
    }
}  // end dropevent function

Answer 1

If you only encounter a problem from Index 2 of your array, that contains MANAGER, this would create the following code:

sym.$('MANAGER').addClass('drag2');

If you have any other classes, that are drag2, this would cause a conflict in the selection. Check your code for any classes or IDs that might match other than