<videocontrolsautoplaywidth="515"height="234"poster="image that displays when video is not playing"><sourcesrc="sd/dsfsd.mp4"><sourcesrc="sd/dsfsd.webm"type='video/ogg; codecs="theora, vorbis"'><!-- NOTE use single quote to wrap double quotes --><object>this should be the fallback flash player</object><p>the text is displayed if your video is NOT supported</p></video>

By using end(), the first find() is undone, so we can start search with the next find() at our #faq element, instead of the dd children.
Within the click handler, the function passed to the click() method, we use $(this).next() to find the next sibling starting from the current dt.

What's 'this'?

Note the $("a.remote", this) query, this is passed as a context: For the document ready event, this refers to the document, and it therefore searches the entire document for anchors with class remote. When addClickHandlers is used as a callback for load(), this refers to a different element: In the example, the element with id target. This prevents that the click event is applied again and again to the same links, causing a crash eventually.

DOM:

event:

e.target vs e.currentTarget:

if you have 'click tr', then clicking on td will trigger that event too with e.target being td and currentTarget being tr

get html5 data- attributes

use attr(). the data() will convert to lowercase and to camelCase. Use data() to store dynamically generated data

XPath

[]
examples:

$("a[name]").css("background", "#eee" ); // add a background color to all anchor elements with a name attribute.
$("#orderedlist > li").addClass("blue"); // This selects all child lis of the element with the id orderedlist and adds the class "blue".