<div xmlns='http://www.w3.org/1999/xhtml'>failed: SqlDateTime overflow. Must be between 1/1/1753 12:00:00 AM and 12/31/9999 11:59:59 PM.

        <span xmlns=''><p>jQuery provide an function "animate", it can be extended to add your custom animation.
        </p><p><span style='font-family:Times New Roman; font-size:18pt'><strong>animate(params, speed, easing, callback)
        </strong></span></p><ul><li><span style='font-family:Courier New; font-size:10pt'>params (Hash)</span><span style='font-family:Times New Roman; font-size:12pt'>: A set of style attributes that you wish to animate, and to what end.
        </span></li><li><span style='font-family:Courier New; font-size:10pt'>speed (String|Number)</span><span style='font-family:Times New Roman; font-size:12pt'>: (optional) A string representing one of the three predefined speeds ("slow", "normal", or "fast") or the number of milliseconds to run the animation (e.g. 1000).
        </span></li><li><span style='font-family:Courier New; font-size:10pt'>easing (String)</span><span style='font-family:Times New Roman; font-size:12pt'>: (optional) The name of the easing effect that you want to use, out of box there are two values "linear" and "swing"  (Plugin Required).
        </span></li><li><span style='font-family:Courier New; font-size:10pt'>callback (Function)</span><span style='font-family:Times New Roman; font-size:12pt'>: (optional) A function to be executed whenever the animation completes, executes once for each element animated against.
        </span></li></ul><p><span style='font-family:Times New Roman; font-size:12pt'>    easing: {
        </span></p><p><span style='font-family:Times New Roman; font-size:12pt'>        linear: function( p, n, firstNum, diff ) {
        </span></p><p><span style='font-family:Times New Roman; font-size:12pt'>            return firstNum + diff * p;
        </span></p><p><span style='font-family:Times New Roman; font-size:12pt'>        },
        </span></p><p><span style='font-family:Times New Roman; font-size:12pt'>        swing: function( p, n, firstNum, diff ) {
        </span></p><p><span style='font-family:Times New Roman; font-size:12pt'>            return ((-Math.cos(p*Math.PI)/2) + 0.5) * diff + firstNum;
        </span></p><p><span style='font-family:Times New Roman; font-size:12pt'>        }
        </span></p><p><span style='font-family:Times New Roman; font-size:12pt'>    },
        </span></p><p>All the build in animate is based on this function
        </p><p>
         </p><p><span style='font-family:Times New Roman; font-size:12pt'>The key aspect of this function is the object of style properties that will be animated, and to what end. Each key within the object represents a style property that will also be animated (for example: "height", "top", or "opacity").
        </span></p><p><span style='font-family:Times New Roman; font-size:12pt'>Note that properties should be specified using camel case eg. marginLeft instead of margin-left.
        </span></p><p><span style='font-family:Times New Roman; font-size:12pt'>The value associated with the key represents to what end the property will be animated. If a number is provided as the value, then the style property will be transitioned from its current state to that new number. Otherwise if the string "hide", "show", or "toggle" is provided, a default animation will be constructed for that property.
        </span></p><p>
         </p><p>.</p></span>

        <span xmlns=''><p><span style='font-family:Times New Roman; font-size:13pt'><strong>attr( key, fn )
        </strong></span></p><p><span style='font-family:Times New Roman; font-size:12pt'>Sets title attribute from src attribute.
        </span></p><p><span style='font-family:Courier New; font-size:10pt'> $("img").attr("title", function() { return this.src });
        </span></p><p>
         </p><p><span style='font-family:Times New Roman; font-size:13pt'><strong>toggleClass( class )
        </strong></span></p><p><code>$("p").toggleClass("selected")
        </pre></p><p>
         </p><p>Before
        </p><p><code><p>Hello</p><p class="selected">Hello Again</p>
        </pre></p><p>
         </p><p>After
        </p><p><code>[ <p class="selected">Hello</p>, <p>Hello Again</p> ]
        </pre></p><p>
         </p><p>
         </p><p><span style='font-family:Times New Roman; font-size:18pt'><strong>get()
        </strong></span></p><p>return an array that contains in jQuery object
        </p><p>
         </p><p><span style='font-family:Times New Roman; font-size:18pt'><strong>get( num )
        </strong></span></p><p>return an
        </p><p>
         </p><p><span style='font-family:Times New Roman; font-size:18pt'><strong>html(), text()  and val()
        </strong></span></p><p><span style='font-family:Times New Roman; font-size:18pt'><strong>html(val), text(val) and val(val)
        </strong></span></p><p><span style='font-family:Times New Roman; font-size:18pt'><strong>end()
        </strong></span></p><p><span style='font-family:Times New Roman; font-size:12pt'>Revert the most recent 'destructive' operation, changing the set of matched elements to its previous state (right before the destructive operation).
        </span></p><p><span style='font-family:Times New Roman; font-size:12pt'>If there was no destructive operation before, an empty set is returned.
        </span></p><p><span style='font-family:Times New Roman; font-size:12pt'>A 'destructive' operation is any operation that changes the set of matched jQuery elements. These functions are: </span><span style='font-family:Courier New; font-size:10pt'>add</span><span style='font-family:Times New Roman; font-size:12pt'>, </span><span style='font-family:Courier New; font-size:10pt'>children</span><span style='font-family:Times New Roman; font-size:12pt'>, </span><span style='font-family:Courier New; font-size:10pt'>clone</span><span style='font-family:Times New Roman; font-size:12pt'>, </span><span style='font-family:Courier New; font-size:10pt'>filter</span><span style='font-family:Times New Roman; font-size:12pt'>, </span><span style='font-family:Courier New; font-size:10pt'>find</span><span style='font-family:Times New Roman; font-size:12pt'>, </span><span style='font-family:Courier New; font-size:10pt'>not</span><span style='font-family:Times New Roman; font-size:12pt'>, </span><span style='font-family:Courier New; font-size:10pt'>next</span><span style='font-family:Times New Roman; font-size:12pt'>, </span><span style='font-family:Courier New; font-size:10pt'>parent</span><span style='font-family:Times New Roman; font-size:12pt'>, </span><span style='font-family:Courier New; font-size:10pt'>parents</span><span style='font-family:Times New Roman; font-size:12pt'>, </span><span style='font-family:Courier New; font-size:10pt'>prev</span><span style='font-family:Times New Roman; font-size:12pt'> and </span><span style='font-family:Courier New; font-size:10pt'>siblings</span><span style='font-family:Times New Roman; font-size:12pt'>.
        </span></p></span>

        While IE support all 4 properties, firefox only support innerHTML.
        <br />
        However, innerHTML is not w3c standard. But using it is much faster than standard dom manipualation.

        <span xmlns=''><p><span style='font-family:Times New Roman; font-size:18pt'><strong>CSS Selectors
        </strong></span></p><ul><li><span style='font-family:Times New Roman; font-size:12pt'><strong>*</strong> any element
        </span></li><li><span style='font-family:Times New Roman; font-size:12pt'><strong>E</strong> an element of type E
        </span></li><li><span style='font-family:Times New Roman; font-size:12pt'><strong>E:nth-child(n)</strong> an E element, the n-th child of its parent
        </span></li><li><span style='font-family:Times New Roman; font-size:12pt'><strong>E:first-child</strong> an E element, first child of its parent
        </span></li><li><span style='font-family:Times New Roman; font-size:12pt'><strong>E:last-child</strong> an E element, last child of its parent
        </span></li><li><span style='font-family:Times New Roman; font-size:12pt'><strong>E:only-child</strong> an E element, only child of its parent
        </span></li><li><span style='font-family:Times New Roman; font-size:12pt'><strong>E:empty</strong> an E element that has no children (including text nodes)
        </span></li><li><span style='font-family:Times New Roman; font-size:12pt'><strong>E:enabled</strong> a user interface element E which is not disabled
        </span></li><li><span style='font-family:Times New Roman; font-size:12pt'><strong>E:disabled</strong> a user interface element E which is disabled
        </span></li><li><span style='font-family:Times New Roman; font-size:12pt'><strong>E:checked</strong> a user interface element E which is checked (for instance a radio-button or checkbox)
        </span></li><li><span style='font-family:Times New Roman; font-size:12pt'><strong>E:selected</strong> a user interface element E which is selected (one or more option elements inside a select) - not in the CSS spec, but nonetheless supported by jQuery
        </span></li><li><span style='font-family:Times New Roman; font-size:12pt'><strong>E.warning</strong> an E element whose class is "warning"
        </span></li><li><span style='font-family:Times New Roman; font-size:12pt'><strong>E#myid</strong> an E element with ID equal to "myid". (Will only match, at most, one element.)
        </span></li><li><span style='font-family:Times New Roman; font-size:12pt'><strong>E:not(s)</strong> an E element that does not match simple selector s
        </span></li><li><span style='font-family:Times New Roman; font-size:12pt'><strong>E F</strong> an F element descendant of an E element
        </span></li><li><span style='font-family:Times New Roman; font-size:12pt'><strong>E > F</strong> an F element child of an E element
        </span></li><li><span style='font-family:Times New Roman; font-size:12pt'><strong>E + F</strong> an F element immediately preceded by an E element
        </span></li><li><span style='font-family:Times New Roman; font-size:12pt'><strong>E ~ F</strong> an F element preceded by an E element
        </span></li><li><span style='font-family:Times New Roman; font-size:12pt'><strong>E,F,G</strong> select all E elements, F elements, and G elements
        </span></li><li><span style='font-family:Times New Roman; font-size:12pt; background-color:yellow'><strong>E[@foo]</strong> an E element with a "foo" attribute
        </span></li><li><span style='font-family:Times New Roman; font-size:12pt; background-color:yellow'><strong>E[@foo=bar]</strong> an E element whose "foo" attribute value is exactly equal to "bar"
        </span></li><li><span style='font-family:Times New Roman; font-size:12pt; background-color:yellow'><strong>E[@foo^=bar]</strong> an E element whose "foo" attribute value begins exactly with the string "bar"
        </span></li><li><span style='font-family:Times New Roman; font-size:12pt; background-color:yellow'><strong>E[@foo$=bar]</strong> an E element whose "foo" attribute value ends exactly with the string "bar"
        </span></li><li><span style='font-family:Times New Roman; font-size:12pt; background-color:yellow'><strong>E[@foo*=bar]</strong> an E element whose "foo" attribute value contains the substring "bar"
        </span></li></ul><p><span style='font-family:Times New Roman; font-size:18pt'><strong>XPath Selectors
        </strong></span></p><p><span style='font-family:Times New Roman; font-size:13pt'><strong>Location Paths
        </strong></span></p><ul><li><span style='font-family:Times New Roman; font-size:12pt'>Relative to the entire HTML document
        </span></li></ul><p><span style='font-family:Courier New; font-size:10pt'> $("/html/body//p")
        </span></p><p><span style='font-family:Courier New; font-size:10pt'> $("body//p")
        </span></p><p><span style='font-family:Courier New; font-size:10pt'> $("p/../div")
        </span></p><ul><li><span style='font-family:Times New Roman; font-size:12pt'>Relative to the context node </span><span style='font-family:Courier New; font-size:10pt'>this</span><span style='font-family:Times New Roman; font-size:12pt'>
        </span></li></ul><p><span style='font-family:Courier New; font-size:10pt'> $("p/*", this)
        </span></p><p><span style='font-family:Courier New; font-size:10pt'> $("/p//a", this)
        </span></p><p><span style='font-family:Times New Roman; font-size:12pt'>[<a title='Edit section: Supported Axis Selectors' href='http://docs.jquery.com/action/edit/DOM/Traversing/Selectors?section=9'><span style='color:blue; text-decoration:underline'>edit</span></a>]
        </span></p><p><span style='font-family:Times New Roman; font-size:13pt'><strong><a name='Supported_Axis_Selectors'/>Supported Axis Selectors
        </strong></span></p><ul><li><span style='font-family:Times New Roman; font-size:12pt'><strong>Descendant</strong> Element has a descendant element
        </span></li></ul><p><span style='font-family:Courier New; font-size:10pt'> $("//div//p")
        </span></p><ul><li><span style='font-family:Times New Roman; font-size:12pt'><strong>Child</strong> Element has a child element
        </span></li></ul><p><span style='font-family:Courier New; font-size:10pt'> $("//div/p")
        </span></p><ul><li><span style='font-family:Times New Roman; font-size:12pt'><strong>Preceding Sibling</strong> Element has an element before it, on the same axes
        </span></li></ul><p><span style='font-family:Courier New; font-size:10pt'> $("//div ~ form")
        </span></p><ul><li><span style='font-family:Times New Roman; font-size:12pt'><strong>Parent</strong> Selects the parent element of the element
        </span></li></ul><p><span style='font-family:Courier New; font-size:10pt'> $("//div/../p")
        </span></p><p><span style='font-family:Times New Roman; font-size:12pt'>[<a title='Edit section: Supported Predicates' href='http://docs.jquery.com/action/edit/DOM/Traversing/Selectors?section=10'><span style='color:blue; text-decoration:underline'>edit</span></a>]
        </span></p><p><span style='font-family:Times New Roman; font-size:13pt'><strong><a name='Supported_Predicates'/>Supported Predicates
        </strong></span></p><ul><li><span style='font-family:Times New Roman; font-size:12pt'><strong>[@foo]</strong> Has an attribute of foo
        </span></li></ul><p><span style='font-family:Courier New; font-size:10pt'> $("//input[@checked]")
        </span></p><ul><li><span style='font-family:Times New Roman; font-size:12pt'><strong>[@foo='test']</strong> Attribute foo is equal to test
        </span></li></ul><p><span style='font-family:Courier New; font-size:10pt'> $("//a[@ref='nofollow']")
        </span></p><ul><li><span style='font-family:Times New Roman; font-size:12pt'><strong>[Nodelist]</strong> Element contains a node list, for example:
        </span></li></ul><p><span style='font-family:Courier New; font-size:10pt'> $("//div[p]")
        </span></p><p><span style='font-family:Courier New; font-size:10pt'> $("//div[p/a]")
        </span></p><p><span style='font-family:Times New Roman; font-size:12pt'>[<a title='Edit section: Supported Predicates, but differently' href='http://docs.jquery.com/action/edit/DOM/Traversing/Selectors?section=11'><span style='color:blue; text-decoration:underline'>edit</span></a>]
        </span></p><p><span style='font-family:Times New Roman; font-size:13pt'><strong>Supported Predicates, but differently
        </strong></span></p><ul><li><span style='font-family:Times New Roman; font-size:12pt'><strong>[last()] or [position()=last()]</strong> becomes <strong>:last</strong>
        </span></li></ul><p><span style='font-family:Courier New; font-size:10pt'> $("p:last")
        </span></p><ul><li><span style='font-family:Times New Roman; font-size:12pt'><strong>[0] or [position()=0]</strong> becomes <strong>:eq(0) or :first</strong>
        </span></li></ul><p><span style='font-family:Courier New; font-size:10pt'> $("p:first")
        </span></p><p><span style='font-family:Courier New; font-size:10pt'> $("p:eq(0)")
        </span></p><ul><li><span style='font-family:Times New Roman; font-size:12pt'><strong>[position() < 5]</strong> becomes <strong>:lt(5)</strong>
        </span></li></ul><p><span style='font-family:Courier New; font-size:10pt'> $("p:lt(5)")
        </span></p><ul><li><span style='font-family:Times New Roman; font-size:12pt'><strong>[position() > 2]</strong> becomes <strong>:gt(2)</strong>
        </span></li></ul><p><span style='font-family:Courier New; font-size:10pt'> $("p:gt(2)")
        </span></p><p><span style='font-family:Times New Roman; font-size:18pt'><strong>Custom Selectors
        </strong></span></p><ul><li><span style='font-family:Times New Roman; font-size:12pt'><strong>:even</strong> Selects every other (even) element from the matched element set.
        </span></li><li><span style='font-family:Times New Roman; font-size:12pt'><strong>:odd</strong> Selects every other (odd) element from the matched element set.
        </span></li><li><span style='font-family:Times New Roman; font-size:12pt'><strong>:eq(0) and :nth(0)</strong> Selects the Nth element from the matched element set
        </span></li><li><span style='font-family:Times New Roman; font-size:12pt'><strong>:gt(N)</strong> Selects all matched elements whose index is greater than N.
        </span></li><li><span style='font-family:Times New Roman; font-size:12pt'><strong>:lt(N)</strong> Selects all matched elements whose index is less than N.
        </span></li><li><span style='font-family:Times New Roman; font-size:12pt'><strong>:first</strong> Equivalent to <strong>:eq(0)</strong>
        </span></li><li><span style='font-family:Times New Roman; font-size:12pt'><strong>:last</strong> Selects the last matched element.
        </span></li><li><span style='font-family:Times New Roman; font-size:12pt'><strong>:parent</strong> Selects all elements which have child elements (including text).
        </span></li><li><span style='font-family:Times New Roman; font-size:12pt'><strong>:contains('test')</strong> Selects all elements which contain the specified text.
        </span></li><li><span style='font-family:Times New Roman; font-size:12pt'><strong>:visible</strong> Selects all visible elements (this includes items that have a display of block or inline, a visibility of visible, and aren't form elements of type hidden)
        </span></li><li><span style='font-family:Times New Roman; font-size:12pt'><strong>:hidden</strong> Selects all hidden elements (this includes items that have a display of none, or a visibility of hidden, or are form elements of type hidden)
        </span></li></ul><p><span style='font-family:Times New Roman; font-size:12pt'>Some examples:
        </span></p><p><span style='font-family:Courier New; font-size:10pt'> $("p:first").css("fontWeight","bold");
        </span></p><p><span style='font-family:Courier New; font-size:10pt'> $("div:hidden").show();
        </span></p><p><span style='font-family:Courier New; font-size:10pt'> $("/div:contains('test')", this).hide();
        </span></p><p><span style='font-family:Times New Roman; font-size:18pt'><strong>Form Selectors
        </strong></span></p><p><span style='font-family:Times New Roman; font-size:12pt'>There are a few selectors for form elements:
        </span></p><ul><li><span style='font-family:Times New Roman; font-size:12pt'><strong>:input</strong> Selects all form elements (input, select, textarea, button).
        </span></li><li><span style='font-family:Times New Roman; font-size:12pt'><strong>:text</strong> Selects all text fields (type="text").
        </span></li><li><span style='font-family:Times New Roman; font-size:12pt'><strong>:password</strong> Selects all password fields (type="password").
        </span></li><li><span style='font-family:Times New Roman; font-size:12pt'><strong>:radio</strong> Selects all radio fields (type="radio").
        </span></li><li><span style='font-family:Times New Roman; font-size:12pt'><strong>:checkbox</strong> Selects all checkbox fields (type="checkbox").
        </span></li><li><span style='font-family:Times New Roman; font-size:12pt'><strong>:submit</strong> Selects all submit buttons (type="submit").
        </span></li><li><span style='font-family:Times New Roman; font-size:12pt'><strong>:image</strong> Selects all form images (type="image").
        </span></li><li><span style='font-family:Times New Roman; font-size:12pt'><strong>:reset</strong> Selects all reset buttons (type="reset").
        </span></li><li><span style='font-family:Times New Roman; font-size:12pt'><strong>:button</strong> Selects all other buttons (type="button").
        </span></li><li><span style='font-family:Times New Roman; font-size:12pt'><strong>:file</strong> Selects all <input type="file">.
        </span></li></ul></span>