I encountered a really weird bug today in my javascript. I'm working on a CMS and one of the things it handles is adding, uploading and resizing images. So, one function adds an empty image to the dom, unselects the currently selected image and selects the new empty image. Pretty straighforward right? So the problem is the unselect function didn't want to work. The image is added and gets selected but the previous image is also still selected.

I set a few breakpoints checked every variable but everything was the way it should. So after an hour trying things I discovered that if I removed the code where the image get added to the body the deselect function works (innerHTML += element) I thought maybe a little timout between these two actions would work but it didn't work. It looks like all dom actions lock up after the empty image gets added. I didn't understood so I moved the unselect function to the above the image add code and it worked wut ??.

code before fix:
func:
body.innerHTML += html;
unselect();
select();

after:
func:
unselect();
body.innerHTML += html;
select();

Atleast its fixed now