On Friday I came across a jQuery thread on Reddit that featured a screen shot of handsome ugly code. It had a few comments, more joking about the code than anything productive, and looked similar to the posts I see on /r/badcode.

jQuery Callback Hell

Above is the screen shot included with the post, and it features a set of elements being moved with the jQuery SlideDown and SlideUp methods. Each is included as a callback/closure of the previous which ends up deep nesting the code. If this were a set of more involved closures the code would be almost guaranteed to be difficult to understand and potentially extremely difficult to debug.

After reading the existing comments a redditor suggested using promises, while promises are extremely useful I disagreed that they were the best decision. I outlined in plain language in my mind how I would solve the problem. No one really seemed to respond to that, and soon enough another commenter asked [serious] what is the “cleanest way to write a chain like this” would be. I felt I should write up a codepen.

Note: This is an old post written in October 2015 that was forgotten in draft mode.