Exterminating Common jQuery Bugs

jQuery is so easy to use and thankfully abstracts many of the cross-browser concerns we used to labor over years ago. However, as with any library there are a common set of bugs that tend to crop up the more you use it. This session aims to help equip developers with the appropriate knowledge and tools to exterminate many common bugs seen in jQuery code. For each topic that is covered we will start with a piece of code that has a jQuery bug, then identify what the bug is, explain why it is happening, and then proceed to explore various techniques to exterminate the bug. Some bugs have a simple fix, whereas other bugs have numerous ways you could look at solving the problem. These solutions can range from simple to advanced concepts. By exterminating bugs in multiple ways it will help expose some of the newer and more advanced features of jQuery that aren't as widely known. Some of the bugs that we will address involve dealing with synchronous and asynchronous code, uncovering some possibly confusing aspects of the $.each method, explaining why and how you might have killed event delegation, looking into weird formatting issues when dealing with JSON and object literals, discussing the confusion of the jQuery wrapper versus the native DOM element, explaining the difference between commonly confused jQuery methods, uncovering why some animations have a mind of their own, determining when several ajax calls have finished, and much more. As you might have noticed some of the examples listed above aren't necessarily jQuery specific, but since the library is JavaScript there are many core concepts of JavaScript that are necessary to understand when using jQuery.