Search code examples
javascriptjquerytoggleclass

When i am using alert, toggleClass is working otherwise not. Why?

The Question is when i am using alert, toggleClass works otherwise not.

Here is my code

$(testParentSpan).click(function(){
      $(this).toggleClass("parent1");
      alert("test is click");
});

where as testParentSpan is variable storing whole span tag

var testParentSpan = htmlLabelElementObj.parentElement.parentElement.parentNode.parentNode.parentNode.firstChild;

css

span.parent1 span.dynatree-icon {
    background-image: url('closefolder.png') !important;
}

/*span.parent1[class~='dynatree-expanded'] */
span.dynatree-expanded[class~=parent1] span.dynatree-icon  {
    background-image: url('openfolder1.png') !important;
}

I tried

$(testParentSpan).bind('click','.class',function(){ 
    $(this).toggleClass("parent1");
      alert("test is click");
});

same effect no change. when i use alert it works otherwise not.

Solution

  • The only reasonable thing that comes to mind is that you might have some code that changes the css classes or does some other dom manipulation, and that code delays it's execution in the alert sceanario - alert blocks the control flow. From the info supplied in the question I can only suggest to debug in order to track where the code that generates this race condition occurs...