3 ways to ajax sequentially

One is to chain ajax calls through callbacks (have your Ajax callback go to a handler that starts the next ajax request). This is the simplest implementation but deep call chain will cause maintenance headache due to tightly coupling. It is serial requests and serial responses.

The second method is to have a class to manage a queue of requests, and process them sequentially. The sexy.js does parallel requests and serial responses. The library might be of this solution.

The third way is jQuery Deferred to force async functions to execute sequentially by using its pipe chaining http://api.jquery.com/category/deferred-object/. jQuery 1.5 starts to implement Promise/A spec and provides a bunch of interfaces like when(), done(), fail(), then(), reject(), and resolve() etc.

CSS Selectors

http://www.w3.org/TR/css3-selectors/#selectors

Universal selector => *
ID selector => #myid
Class selector => .myclass
Type (element) selector => p
Attribute selector => E[foo^="bar"]Structural pseudo-classes => E:nth-child(n)
User action pseudo-classes => E:hover
Element state pseudo-classes => E:enabled
Negation pseudo-class => E:not(selector)
Pseudo-elements => E::before

Combinators => Descendant (space), Child (>), Adjacent sibling (+) and General sibling (~)

For HTML, case insensitive.

I also have a post about CSS Performance. Selector efficiency is key to performance in jQuery programming, which basically is to select something, take some actions against DOM.

3 heights in DOM

scrollHeight
Returns the total height of an element's contents, in pixels. The value contains the height with the padding, but does not include the scrollBar, border, and the margin.

clientHeight
Returns the height of the visible area for an object, in pixels. The value contains the height with the padding, but it does not include the scrollBar, border, and the margin.

offsetHeight
Returns the height of the visible area for an object, in pixels. The value contains the height with the padding, scrollBar, and the border, but does not include the margin.

One use case is to push page footer at the bottom by setting body content height dynamically based on current document height.
http://james.padolsey.com/javascript/get-document-height-cross-browser/ has the details, but the idea is to find the max value of these 3 heights from document.body and document.documentElement.

I use the jquery version from its comment section which is easier.
Math.max($(document).height(), $(window).height(), /* For opera: */ document.documentElement.clientHeight)

The corresponding scrollWidth, clientWidth, offsetWidth have similar concepts.