dictionary.xml

<?xml version="1.0"?>
<!-- This file is generated from api-1.3.xml using XSLT and dictionary.xsl -->
<d:dictionary xmlns="http://www.w3.org/1999/xhtml" xmlns:d="http://www.apple.com/DTDs/DictionaryService-1.0.rng">
  <d:entry id="id4607705" d:title="Traversing/add(expr)">
    <d:index d:value="add" d:title="Traversing/add(expr)"/>
    <p class="title">Traversing/add(expr)</p>
    <p>
					Adds more elements, matched by the given expression, to the set of matched elements.
				</p>
    <p>
					
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>expr (<span class="arg-type" title="">String, DOMElement, Array&lt;DOMElement&gt;</span>)</span>
    						- 
						An expression whose matched elements are added for String, a string of HTML to create on the fly for DOMElement or one or more Elements to add if an Array. A jQuery object is also accepted.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Finds all divs and makes a border.  Then adds all paragraphs to the jQuery object to set their backgrounds yellow.
					</p>
    <pre>
      <code class="javascript">$("div").css("border", "2px solid red")
            .add("p")
            .css("background", "yellow");

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div&gt;&lt;/div&gt;
  &lt;div&gt;&lt;/div&gt;
  &lt;div&gt;&lt;/div&gt;
  &lt;div&gt;&lt;/div&gt;
  &lt;div&gt;&lt;/div&gt;
  &lt;div&gt;&lt;/div&gt;
  &lt;p&gt;Added this... (notice no border)&lt;/p&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Adds more elements, matched by the given expression, to the set of matched elements.
					</p>
    <pre>
      <code class="javascript">$("p").add("span").css("background", "yellow");
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;Hello&lt;/p&gt;&lt;span&gt;Hello Again&lt;/span&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Adds more elements, created on the fly, to the set of matched elements.
					</p>
    <pre>
      <code class="javascript">$("p").clone().add("&amp;lt;span&gt;Again&amp;lt;/span&gt;").appendTo(document.body);
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;Hello&lt;/p&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Adds one or more Elements to the set of matched elements.
					</p>
    <pre>
      <code class="javascript">$("p").add(document.getElementById("a")).css("background", "yellow");
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;Hello&lt;/p&gt;&lt;span id="a"&gt;Hello Again&lt;/span&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Demonstrates how to add (or push) elements to an existing collection
					</p>
    <pre>
      <code class="javascript">var collection = $("p");
// capture the new collection
collection = collection.add(document.getElementById("a"));
collection.css("background", "yellow");
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;Hello&lt;/p&gt;&lt;span id="a"&gt;Hello Again&lt;/span&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4606200" d:title="Attributes/addClass(class)">
    <d:index d:value="addClass" d:title="Attributes/addClass(class)"/>
    <p class="title">Attributes/addClass(class)</p>
    <p>
					Adds the specified class(es) to each of the set of matched elements.
				</p>
    <p>
					
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>class (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						One or more classes to add to the elements, these are separated by spaces.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Adds the class 'selected' to the matched elements.
					</p>
    <pre>
      <code class="javascript">$("p:last").addClass("selected");
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;Hello&lt;/p&gt;
  &lt;p&gt;and&lt;/p&gt;
  &lt;p&gt;Goodbye&lt;/p&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Adds the classes 'selected' and 'highlight' to the matched elements.
					</p>
    <pre>
      <code class="javascript">$("p:last").addClass("selected highlight");
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;Hello&lt;/p&gt;
  &lt;p&gt;and&lt;/p&gt;
  &lt;p&gt;Goodbye&lt;/p&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4609537" d:title="Manipulation/after(content)">
    <d:index d:value="after" d:title="Manipulation/after(content)"/>
    <p class="title">Manipulation/after(content)</p>
    <p>
					Insert content after each of the matched elements.
				</p>
    <p>
					&lt;p&gt;The elements must already be inserted into the document (you can't insert an element after another if it's not in the page).&lt;/p&gt;
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>content (<span class="arg-type" title="">String, Element, jQuery</span>)</span>
    						- 
						Content to insert after each target.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Inserts some HTML after all paragraphs.
					</p>
    <pre>
      <code class="javascript">$("p").after("&lt;b&gt;Hello&lt;/b&gt;");
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;I would like to say: &lt;/p&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Inserts a DOM element after all paragraphs.
					</p>
    <pre>
      <code class="javascript">$("p").after( document.createTextNode("Hello") );
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;I would like to say: &lt;/p&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Inserts a jQuery object (similar to an Array of DOM Elements) after all paragraphs.
					</p>
    <pre>
      <code class="javascript">$("p").after( $("b") );
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;b&gt;Hello&lt;/b&gt;
  &lt;p&gt;I would like to say: &lt;/p&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4670772" d:title="Ajax/ajaxComplete(callback)">
    <d:index d:value="ajaxComplete" d:title="Ajax/ajaxComplete(callback)"/>
    <p class="title">Ajax/ajaxComplete(callback)</p>
    <p>
					Attach a function to be executed whenever an AJAX request completes. This is an 
&lt;a href='Ajax_Events'&gt;Ajax Event&lt;/a&gt;					.
				</p>
    <p>
					The XMLHttpRequest and settings used for that request are passed as arguments to the callback.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>callback (<span class="arg-type" title="A reference to a Javascript function.">Function</span>)</span>
    						- 
						The function to execute.
&lt;pre&gt;function (event, XMLHttpRequest, ajaxOptions) {
  this; // dom element listening
}
&lt;/pre&gt;
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Show a message when an AJAX request completes.
					</p>
    <pre>
      <code class="javascript">$("#msg").ajaxComplete(function(event,request, settings){
   $(this).append("&lt;li&gt;Request Complete.&lt;/li&gt;");
 });
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4670838" d:title="Ajax/ajaxError(callback)">
    <d:index d:value="ajaxError" d:title="Ajax/ajaxError(callback)"/>
    <p class="title">Ajax/ajaxError(callback)</p>
    <p>
					Attach a function to be executed whenever an AJAX request fails. This is an 
&lt;a href='Ajax_Events'&gt;Ajax Event&lt;/a&gt;					.
				</p>
    <p>
					The XMLHttpRequest and settings used for that request are passed as arguments to the callback. A third argument, an exception object, is passed if an exception occured while processing the request.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>callback (<span class="arg-type" title="A reference to a Javascript function.">Function</span>)</span>
    						- 
						The function to execute.
&lt;pre&gt;function (event, XMLHttpRequest, ajaxOptions, thrownError) {
  // thrownError only passed if an error was caught
  this; // dom element listening
}
&lt;/pre&gt;
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Show a message when an AJAX request fails.
					</p>
    <pre>
      <code class="javascript">$("#msg").ajaxError(function(event, request, settings){
   $(this).append("&lt;li&gt;Error requesting page " + settings.url + "&lt;/li&gt;");
 });
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4670907" d:title="Ajax/ajaxSend(callback)">
    <d:index d:value="ajaxSend" d:title="Ajax/ajaxSend(callback)"/>
    <p class="title">Ajax/ajaxSend(callback)</p>
    <p>
					Attach a function to be executed before an AJAX request is sent. This is an 
&lt;a href='Ajax_Events'&gt;Ajax Event&lt;/a&gt;					.
				</p>
    <p>
					The XMLHttpRequest and settings used for that request are passed as arguments to the callback.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>callback (<span class="arg-type" title="A reference to a Javascript function.">Function</span>)</span>
    						- 
						The function to execute.
&lt;pre&gt;function (event, XMLHttpRequest, ajaxOptions) {
  this; // dom element listening
}
&lt;/pre&gt;
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Show a message before an AJAX request is sent.
					</p>
    <pre>
      <code class="javascript">$("#msg").ajaxSend(function(evt, request, settings){
   $(this).append("&lt;li&gt;Starting request at " + settings.url + "&lt;/li&gt;");
 });
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4670972" d:title="Ajax/ajaxStart(callback)">
    <d:index d:value="ajaxStart" d:title="Ajax/ajaxStart(callback)"/>
    <p class="title">Ajax/ajaxStart(callback)</p>
    <p>
					Attach a function to be executed whenever an AJAX request begins and there is none already active. This is an 
&lt;a href='Ajax_Events'&gt;Ajax Event&lt;/a&gt;					.
				</p>
    <p>
					
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>callback (<span class="arg-type" title="A reference to a Javascript function.">Function</span>)</span>
    						- 
						The function to execute.
&lt;pre&gt;function () {
  this; // dom element listening
}
&lt;/pre&gt;
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Show a loading message whenever an AJAX request starts (and none is already active).
					</p>
    <pre>
      <code class="javascript">$("#loading").ajaxStart(function(){
   $(this).show();
 });
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4671032" d:title="Ajax/ajaxStop(callback)">
    <d:index d:value="ajaxStop" d:title="Ajax/ajaxStop(callback)"/>
    <p class="title">Ajax/ajaxStop(callback)</p>
    <p>
					Attach a function to be executed whenever all AJAX requests have ended. This is an 
&lt;a href='Ajax_Events'&gt;Ajax Event&lt;/a&gt;					.
				</p>
    <p>
					
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>callback (<span class="arg-type" title="A reference to a Javascript function.">Function</span>)</span>
    						- 
						The function to execute.
&lt;pre&gt;function () {
  this; // dom element listening
}
&lt;/pre&gt;
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Hide a loading message after all the AJAX requests have stopped.
					</p>
    <pre>
      <code class="javascript">$("#loading").ajaxStop(function(){
   $(this).hide();
 });
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4671093" d:title="Ajax/ajaxSuccess(callback)">
    <d:index d:value="ajaxSuccess" d:title="Ajax/ajaxSuccess(callback)"/>
    <p class="title">Ajax/ajaxSuccess(callback)</p>
    <p>
					Attach a function to be executed whenever an AJAX request completes successfully. This is an 
&lt;a href='Ajax_Events'&gt;Ajax Event&lt;/a&gt;					.
				</p>
    <p>
					The event object, XMLHttpRequest, and settings used for that request are passed as arguments to the callback.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>callback (<span class="arg-type" title="A reference to a Javascript function.">Function</span>)</span>
    						- 
						The function to execute.
&lt;pre&gt;function (event, XMLHttpRequest, ajaxOptions) {
  this; // dom element listening
}
&lt;/pre&gt;
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Show a message when an AJAX request completes successfully.
					</p>
    <pre>
      <code class="javascript">$("#msg").ajaxSuccess(function(evt, request, settings){
   $(this).append("&lt;li&gt;Successful Request!&lt;/li&gt;");
 });
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4602982" d:title="Selectors/all()">
    <d:index d:value="all" d:title="Selectors/all()"/>
    <p class="title">Selectors/all()</p>
    <p>
					Matches all elements.
				</p>
    <p>
					Most useful when combined with a context to search in.
				</p>
    <h2>Example:</h2>
    <p>
						Finds every element (including head, body, etc).
					</p>
    <pre>
      <code class="javascript">$("*").css("border","3px solid red");
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div&gt;DIV&lt;/div&gt;
  &lt;span&gt;SPAN&lt;/span&gt;
  &lt;p&gt;P &lt;button&gt;Button&lt;/button&gt;&lt;/p&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						A common way to find all elements is to set the 'context' to document.body so elements like head, script, etc are left out.
					</p>
    <pre>
      <code class="javascript">$("*", document.body).css("border","3px solid red");
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4608787" d:title="Traversing/andSelf()">
    <d:index d:value="andSelf" d:title="Traversing/andSelf()"/>
    <p class="title">Traversing/andSelf()</p>
    <p>
					Add the previous selection to the current selection.
				</p>
    <p>
					Useful for traversing elements, and then adding something that was matched before the last traversal.
				</p>
    <h2>Example:</h2>
    <p>
						Find all divs, and all the paragraphs inside of them, and give them both classnames.  Notice the div doesn't have the yellow background color since it didn't use andSelf().
					</p>
    <pre>
      <code class="javascript">$("div").find("p").andSelf().addClass("border");
    $("div").find("p").addClass("background");

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div&gt;
    &lt;p&gt;First Paragraph&lt;/p&gt;
    &lt;p&gt;Second Paragraph&lt;/p&gt;
  &lt;/div&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4669045" d:title="Effects/animate(params, options)">
    <d:index d:value="animate" d:title="Effects/animate(params, options)"/>
    <p class="title">Effects/animate(params, options)</p>
    <p>
					A function for making custom animations.
				</p>
    <p>
					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 (e.g. "height", "top", or "opacity").<br xmlns=""/><br xmlns=""/>Note that properties should be specified using camel case, e.g. "marginLeft" instead of "margin-left."<br xmlns=""/><br xmlns=""/>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. 
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>params (<span class="arg-type" title="">Options</span>)</span>
    						- 
						A set of style attributes that you wish to animate, and to what end.
					</li>
        <li><span>options (<span class="arg-type" title="">Options </span>)</span>
    						- 
						A set of options with which to configure the animation.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						The first button shows how an unqueued animation works.  It expands the div out to 90% width '''while''' the font-size is increasing. Once the font-size change is complete, the border animation will begin.

The second button starts a traditional chained animation, where each animation will start once the previous animation on the element has completed.
					</p>
    <pre>
      <code class="javascript">$("#go1").click(function(){
      $("#block1").animate( { width:"90%" }, { queue:false, duration:3000 } )
         .animate( { fontSize:"24px" }, 1500 )
         .animate( { borderRightWidth:"15px" }, 1500);
    });

    $("#go2").click(function(){
      $("#block2").animate( { width:"90%"}, 1000 )
         .animate( { fontSize:"24px" } , 1000 )
         .animate( { borderLeftWidth:"15px" }, 1000);
    });

    $("#go3").click(function(){
      $("#go1").add("#go2").click();
    });

    $("#go4").click(function(){
      $("div").css({width:"", fontSize:"", borderWidth:""});
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;button id="go1"&gt;&amp;raquo; Animate Block1&lt;/button&gt;
  &lt;button id="go2"&gt;&amp;raquo; Animate Block2&lt;/button&gt;
  &lt;button id="go3"&gt;&amp;raquo; Animate Both&lt;/button&gt;
  &lt;button id="go4"&gt;&amp;raquo; Reset&lt;/button&gt;
  &lt;div id="block1"&gt;Block1&lt;/div&gt;
  &lt;div id="block2"&gt;Block2&lt;/div&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Animates all paragraphs to toggle both height and opacity, completing the animation within 600 milliseconds.
					</p>
    <pre>
      <code class="javascript">$("p").animate({
      "height": "toggle", "opacity": "toggle"
    }, { duration: "slow" });
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Animates all paragraph to a left style of 50 and opacity of 1 (opaque, visible), completing the animation within 500 milliseconds.  It also will do it ''outside'' the queue, meaning it will automatically start without waiting for its turn.
					</p>
    <pre>
      <code class="javascript">$("p").animate({
      left: "50px", opacity: 1
    }, { duration: 500, queue: false });
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						An example of using an 'easing' function to provide a different style of animation. This will only work if you have a plugin that provides this easing function.
					</p>
    <pre>
      <code class="javascript">$("p").animate({
      "opacity": "show"
    }, { "duration": "slow", "easing": "easein" });
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						An example of using a callback function.  The first argument is an array of CSS properties, the second specifies that the animation should take 1000 milliseconds to complete, the third states the easing type, and the fourth argument is an anonymous callback function. 
					</p>
    <pre>
      <code class="javascript">$("p").animate({
       height:200, width:400, opacity: .5
    }, 1000, "linear", function(){alert("all done");} );

					</code>
    </pre>
  </d:entry>
  <d:entry id="id4668873" d:title="Effects/animate(params, duration, easing, callback)">
    <d:index d:value="animate" d:title="Effects/animate(params, duration, easing, callback)"/>
    <p class="title">Effects/animate(params, duration, easing, callback)</p>
    <p>
					A function for making custom animations.
				</p>
    <p>
					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").<br xmlns=""/><br xmlns=""/>Note that properties should be specified using camel case, e.g. "marginLeft" instead of "margin-left."<br xmlns=""/><br xmlns=""/>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.  Only properties that take numeric values are supported (e.g. backgroundColor is not supported).<br xmlns=""/><br xmlns=""/>&lt;p&gt;As of jQuery 1.2 you can now animate properties by em and % (where applicable). Additionally, in jQuery 1.2, you can now do relative animations - specifying a "''+=''" or "''-=''" in front of the property value moves the element positively or negatively, relative to its current position.&lt;/p&gt;<br xmlns=""/><br xmlns=""/>&lt;p&gt;As of jQuery 1.3 if you specify an animation duration of 0 then the animation will synchronously set the elements to their end state (this is different from old versions where there would be a brief, asynchronous, delay before the end state would be set).&lt;/p&gt;
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>params (<span class="arg-type" title="">Options</span>)</span>
    						- 
						A set of style attributes that you wish to animate, and to what end.
					</li>
        <li><span>duration (<span class="arg-type" title="">String, Number </span>)</span>
    						- 
						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).
					</li>
        <li><span>easing (<span class="arg-type" title="">String </span>)</span>
    						- 
						The name of the easing effect that you want to use (plugin required). There are two built-in values, "linear" and "swing".
					</li>
        <li><span>callback (<span class="arg-type" title="A reference to a Javascript function.">Function</span>)</span>
    						- 
						A function to be executed whenever the animation completes, executes once for each element animated against.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Click the button to animate the div with a number of different properties.
					</p>
    <pre>
      <code class="javascript">// Using multiple unit types within one animation.
    $("#go").click(function(){
      $("#block").animate({ 
        width: "70%",
        opacity: 0.4,
        marginLeft: "0.6in",
        fontSize: "3em", 
        borderWidth: "10px"
      }, 1500 );
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;button id="go"&gt;&amp;raquo; Run&lt;/button&gt;
  &lt;div id="block"&gt;Hello!&lt;/div&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Shows a div animate with a relative move.  Click several times on the buttons to see the relative animations queued up.
					</p>
    <pre>
      <code class="javascript">$("#right").click(function(){
      $(".block").animate({"left": "+=50px"}, "slow");
    });

    $("#left").click(function(){
      $(".block").animate({"left": "-=50px"}, "slow");
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;button id="left"&gt;&amp;laquo;&lt;/button&gt; &lt;button id="right"&gt;&amp;raquo;&lt;/button&gt;
&lt;div class="block"&gt;&lt;/div&gt;

					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Animates all paragraphs to toggle both height and opacity, completing the animation within 600 milliseconds.
					</p>
    <pre>
      <code class="javascript">$("p").animate({
      "height": "toggle", "opacity": "toggle"
    }, "slow");
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Animates all paragraph to a left style of 50 and opacity of 1 (opaque, visible), completing the animation within 500 milliseconds.
					</p>
    <pre>
      <code class="javascript">$("p").animate({
      "left": "50", "opacity": 1
    }, 500);

					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						An example of using an 'easing' function to provide a different style of animation. This will only work if you have a plugin that provides this easing function.  Note, this code will do nothing unless the paragraph element is hidden.
					</p>
    <pre>
      <code class="javascript">$("p").animate({
      "opacity": "show"
    }, "slow", "easein");
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4603963" d:title="Selectors/animated()">
    <d:index d:value="animated" d:title="Selectors/animated()"/>
    <p class="title">Selectors/animated()</p>
    <p>
					Matches all elements that are currently being animated.
				</p>
    <p>
					
				</p>
    <h2>Example:</h2>
    <p>
						Change the color of any div that is animated.
					</p>
    <pre>
      <code class="javascript">$("#run").click(function(){
      $("div:animated").toggleClass("colored");
    });
    function animateIt() {
      $("#mover").slideToggle("slow", animateIt);
    }
    animateIt();

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;button id="run"&gt;Run&lt;/button&gt;
  &lt;div&gt;&lt;/div&gt;
  &lt;div id="mover"&gt;&lt;/div&gt;
  &lt;div&gt;&lt;/div&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4609218" d:title="Manipulation/append(content)">
    <d:index d:value="append" d:title="Manipulation/append(content)"/>
    <p class="title">Manipulation/append(content)</p>
    <p>
					Append content to the inside of every matched element.
				</p>
    <p>
					This operation is the best way to insert elements inside, at the end, of all matched elements. It is similar to doing an appendChild to all the specified elements, adding them into the document.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>content (<span class="arg-type" title="">String, Element, jQuery</span>)</span>
    						- 
						Content to append to the target.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Appends some HTML to all paragraphs.
					</p>
    <pre>
      <code class="javascript">$("p").append("&lt;strong&gt;Hello&lt;/strong&gt;");
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;I would like to say: &lt;/p&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Appends an Element to all paragraphs.
					</p>
    <pre>
      <code class="javascript">$("p").append(document.createTextNode("Hello"));
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;I would like to say: &lt;/p&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Appends a jQuery object (similar to an Array of DOM Elements) to all paragraphs.
					</p>
    <pre>
      <code class="javascript">$("p").append( $("strong") );
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;strong&gt;Hello world!!!&lt;/strong&gt;&lt;p&gt;I would like to say: &lt;/p&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4609318" d:title="Manipulation/appendTo(selector)">
    <d:index d:value="appendTo" d:title="Manipulation/appendTo(selector)"/>
    <p class="title">Manipulation/appendTo(selector)</p>
    <p>
					Append all of the matched elements to another, specified, set of elements. As of jQuery 1.3.2, returns all of the inserted elements.
				</p>
    <p>
					This operation is, essentially, the reverse of doing a regular $(A).append(B), in that instead of appending B to A, you're appending A to B.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>selector (<span class="arg-type" title="">Selector</span>)</span>
    						- 
						target to which the content will be appended.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Appends all spans to the element with the ID "foo"
					</p>
    <pre>
      <code class="javascript">$("span").appendTo("#foo"); // check append() examples
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;span&gt;I have nothing more to say... &lt;/span&gt;
  &lt;div id="foo"&gt;FOO! &lt;/div&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4605874" d:title="Attributes/attr(name)">
    <d:index d:value="attr" d:title="Attributes/attr(name)"/>
    <p class="title">Attributes/attr(name)</p>
    <p>
					Access a property on the first matched element. This method makes it easy to retrieve a property value from the first matched element. If the element does not have an attribute with such a name, undefined is returned. Attributes include title, alt, src, href, width, style, etc.
				</p>
    <p>
					
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>name (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						The name of the property to access.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Finds the title attribute of the first &lt;em&gt; in the page.
					</p>
    <pre>
      <code class="javascript">var title = $("em").attr("title");
    $("div").text(title);

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;
    Once there was a &lt;em title="huge, gigantic"&gt;large&lt;/em&gt; dinosaur...
  &lt;/p&gt;
  The title of the emphasis is:&lt;div&gt;&lt;/div&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4605932" d:title="Attributes/attr(properties)">
    <d:index d:value="attr" d:title="Attributes/attr(properties)"/>
    <p class="title">Attributes/attr(properties)</p>
    <p>
					Set a key/value object as properties to all matched elements.
				</p>
    <p>
					This serves as the best way to set a large number of properties on all matched elements. Note that you must use 'className' as key if you want to set the class-Attribute. Or use .addClass( class ) or .removeClass( class ). Keep in mind this recursively calls attr( key, value ) or attr ( key, fn ), so if one of the properties you are passing is a function, the function will be evaluated and not stored as the attribute itself.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>properties (<span class="arg-type" title="A Javascript object that contains key/value pairs in the form of properties and values.">Map</span>)</span>
    						- 
						Key/value pairs to set as object properties.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Set some attributes for all &lt;img&gt;s in the page.
					</p>
    <pre>
      <code class="javascript">$("img").attr({ 
          src: "/images/hat.gif",
          title: "jQuery",
          alt: "jQuery Logo"
        });
    $("div").text($("img").attr("alt"));

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;img /&gt;
  &lt;img /&gt;
  &lt;img /&gt;
  &lt;div&gt;&lt;B&gt;Attribute of Ajax&lt;/B&gt;&lt;/div&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4605994" d:title="Attributes/attr(key, value)">
    <d:index d:value="attr" d:title="Attributes/attr(key, value)"/>
    <p class="title">Attributes/attr(key, value)</p>
    <p>
					Set a single property to a value, on all matched elements.
				</p>
    <p>
					
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>key (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						The name of the property to set.
					</li>
        <li><span>value (<span class="arg-type" title="A simple Javascript object..">Object</span>)</span>
    						- 
						The value to set the property to.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Disables buttons greater than the 1st button.
					</p>
    <pre>
      <code class="javascript">$("button:gt(1)").attr("disabled","disabled");
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;button&gt;0th Button&lt;/button&gt;
  &lt;button&gt;1st Button&lt;/button&gt;
  &lt;button&gt;2nd Button&lt;/button&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4606054" d:title="Attributes/attr(key, fn)">
    <d:index d:value="attr" d:title="Attributes/attr(key, fn)"/>
    <p class="title">Attributes/attr(key, fn)</p>
    <p>
					Set a single property to a computed value, on all matched elements.
				</p>
    <p>
					Instead of supplying a string value as described  
&lt;a href='#keyvalue'&gt;above&lt;/a&gt;					, a function is provided that computes the value.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>key (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						The name of the property to set.
					</li>
        <li><span>fn (<span class="arg-type" title="A reference to a Javascript function.">Function</span>)</span>
    						- 
						A function returning the value to set. Scope: Current element, argument: Index of current element
&lt;pre&gt;function callback(indexArray) {
  // indexArray == position in the jQuery object
  this; // dom element
}
&lt;/pre&gt;
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Sets id for divs based on the position in the page.
					</p>
    <pre>
      <code class="javascript">$("div").attr("id", function (arr) {
          return "div-id" + arr;
        })
        .each(function () {
          $("span", this).html("(ID = '&lt;b&gt;" + this.id + "&lt;/b&gt;')");
        });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div&gt;Zero-th &lt;span&gt;&lt;/span&gt;&lt;/div&gt;
  &lt;div&gt;First &lt;span&gt;&lt;/span&gt;&lt;/div&gt;
  &lt;div&gt;Second &lt;span&gt;&lt;/span&gt;&lt;/div&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Sets src attribute from title attribute on the image.
					</p>
    <pre>
      <code class="javascript">$("img").attr("src", function() { 
          return "/images/" + this.title; 
        });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;img title="hat.gif"/&gt;
  &lt;img title="hat-old.gif"/&gt;
  &lt;img title="hat2-old.gif"/&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4604724" d:title="Selectors/attributeContains(attribute, value)">
    <d:index d:value="attributeContains" d:title="Selectors/attributeContains(attribute, value)"/>
    <p class="title">Selectors/attributeContains(attribute, value)</p>
    <p>
					Matches elements that have the specified attribute and it contains a certain value.
				</p>
    <p>
					
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>attribute (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						An attribute name.
					</li>
        <li><span>value (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						An attribute value. Quotes are optional in most cases, but should be used to avoid conflicts when the value contains characters like "]". Variables can be used using the following syntax: [name*='" +MyVar+ "']
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Finds all inputs with a name attribute that contains 'man' and sets the value with some text.
					</p>
    <pre>
      <code class="javascript">$("input[name*='man']").val("has man in it!");
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;input name="man-news" /&gt;
  &lt;input name="milkman" /&gt;
  &lt;input name="letterman2" /&gt;
  &lt;input name="newmilk" /&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4604653" d:title="Selectors/attributeEndsWith(attribute, value)">
    <d:index d:value="attributeEndsWith" d:title="Selectors/attributeEndsWith(attribute, value)"/>
    <p class="title">Selectors/attributeEndsWith(attribute, value)</p>
    <p>
					Matches elements that have the specified attribute and it ends with a certain value.
				</p>
    <p>
					
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>attribute (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						An attribute name.
					</li>
        <li><span>value (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						An attribute value. Quotes are optional in most cases, but should be used to avoid conflicts when the value contains characters like "]". Varibles can be used using the following syntax: [name$='" +MyVar+ "']
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Finds all inputs with an attribute name that ends with 'letter' and puts text in them.
					</p>
    <pre>
      <code class="javascript">$("input[name$='letter']").val("a letter");
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;input name="newsletter" /&gt;
  &lt;input name="milkman" /&gt;
  &lt;input name="jobletter" /&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4604429" d:title="Selectors/attributeEquals(attribute, value)">
    <d:index d:value="attributeEquals" d:title="Selectors/attributeEquals(attribute, value)"/>
    <p class="title">Selectors/attributeEquals(attribute, value)</p>
    <p>
					Matches elements that have the specified attribute with a certain value.
				</p>
    <p>
					
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>attribute (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						An attribute name.
					</li>
        <li><span>value (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						An attribute value. Quotes are optional in most cases, but should be used to avoid conflicts when the value contains characters like "]". Variables can be used using the following syntax: [name='" +MyVar+ "']
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Finds all inputs with name 'newsletter' and changes the text of the span next to it.
					</p>
    <pre>
      <code class="javascript">$("input[name='newsletter']").next().text(" is newsletter");
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div&gt;
    &lt;input type="radio" name="newsletter" value="Hot Fuzz" /&gt;
    &lt;span&gt;name?&lt;/span&gt;
  &lt;/div&gt;
  &lt;div&gt;
    &lt;input type="radio" name="newsletters" value="Cold Fusion" /&gt;
    &lt;span&gt;name?&lt;/span&gt;
  &lt;/div&gt;
  &lt;div&gt;
    &lt;input type="radio" name="accept" value="Evil Plans" /&gt;
    &lt;span&gt;name?&lt;/span&gt;
  &lt;/div&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4604369" d:title="Selectors/attributeHas(attribute)">
    <d:index d:value="attributeHas" d:title="Selectors/attributeHas(attribute)"/>
    <p class="title">Selectors/attributeHas(attribute)</p>
    <p>
					Matches elements that have the specified attribute. Note the "@" before the attribute name was deprecated as of version 1.2.
				</p>
    <p>
					
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>attribute (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						An attribute name.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Bind a single click that adds the div id to its text.
					</p>
    <pre>
      <code class="javascript">$("div[id]").one("click", function(){
      var idString = $(this).text() + " = " + $(this).attr("id");
      $(this).text(idString);
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div&gt;no id&lt;/div&gt;
  &lt;div id="hey"&gt;with id&lt;/div&gt;
  &lt;div id="there"&gt;has an id&lt;/div&gt;
  &lt;div&gt;nope&lt;/div&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4604795" d:title="Selectors/attributeMultiple(attributeFilter1, attributeFilter2, attributeFilterN)">
    <d:index d:value="attributeMultiple" d:title="Selectors/attributeMultiple(attributeFilter1, attributeFilter2, attributeFilterN)"/>
    <p class="title">Selectors/attributeMultiple(attributeFilter1, attributeFilter2, attributeFilterN)</p>
    <p>
					Matches elements that match all of the specified attribute filters.
				</p>
    <p>
					
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>attributeFilter1 (<span class="arg-type" title="">Selector</span>)</span>
    						- 
						An attribute filter.
					</li>
        <li><span>attributeFilter2 (<span class="arg-type" title="">Selector</span>)</span>
    						- 
						Another attribute filter, reducing the selection even more
					</li>
        <li><span>attributeFilterN (<span class="arg-type" title="">Selector</span>)</span>
    						- 
						As many more attribute filters as necessary
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Finds all inputs that have an id attribute and whose name attribute ends with man and sets the value.
					</p>
    <pre>
      <code class="javascript">$("input[id][name$='man']").val("only this one");
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;input id="man-news" name="man-news" /&gt;
  &lt;input name="milkman" /&gt;
  &lt;input id="letterman" name="new-letterman" /&gt;
  &lt;input name="newmilk" /&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4604505" d:title="Selectors/attributeNotEqual(attribute, value)">
    <d:index d:value="attributeNotEqual" d:title="Selectors/attributeNotEqual(attribute, value)"/>
    <p class="title">Selectors/attributeNotEqual(attribute, value)</p>
    <p>
					Matches elements that either don't have the specified attribute or do have the specified attribute but not with a certain value.
				</p>
    <p>
					This functionality is equivalent to &lt;code&gt;:not([attr=value])&lt;/code&gt;. 
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>attribute (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						An attribute name.
					</li>
        <li><span>value (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						An attribute value. Quotes are optional in most cases, but should be used to avoid conflicts when the value contains characters like "]". Varibles can be used using the following syntax: [name!='" +MyVar+ "']
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Finds all inputs that don't have the name 'newsletter' and appends text to the span next to it.
					</p>
    <pre>
      <code class="javascript">$("input[name!=newsletter]").next().append("&lt;b&gt;; not newsletter&lt;/b&gt;");
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div&gt;
    &lt;input type="radio" name="newsletter" value="Hot Fuzz" /&gt;
    &lt;span&gt;name is newsletter&lt;/span&gt;
  &lt;/div&gt;
  &lt;div&gt;
    &lt;input type="radio" value="Cold Fusion" /&gt;
    &lt;span&gt;no name&lt;/span&gt;
  &lt;/div&gt;
  &lt;div&gt;
    &lt;input type="radio" name="accept" value="Evil Plans" /&gt;
    &lt;span&gt;name is accept&lt;/span&gt;
  &lt;/div&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4604582" d:title="Selectors/attributeStartsWith(attribute, value)">
    <d:index d:value="attributeStartsWith" d:title="Selectors/attributeStartsWith(attribute, value)"/>
    <p class="title">Selectors/attributeStartsWith(attribute, value)</p>
    <p>
					Matches elements that have the specified attribute and it starts with a certain value.
				</p>
    <p>
					
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>attribute (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						An attribute name.
					</li>
        <li><span>value (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						An attribute value. Quotes are optional in most cases, but should be used to avoid conflicts when the value contains characters like "]". Variables can be used using the following syntax: [name^='" +MyVar+ "']
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Finds all inputs with an attribute name that starts with 'news' and puts text in them.
					</p>
    <pre>
      <code class="javascript">$("input[name^='news']").val("news here!");
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;input name="newsletter" /&gt;
  &lt;input name="milkman" /&gt;
  &lt;input name="newsboy" /&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4609638" d:title="Manipulation/before(content)">
    <d:index d:value="before" d:title="Manipulation/before(content)"/>
    <p class="title">Manipulation/before(content)</p>
    <p>
					Insert content before each of the matched elements.
				</p>
    <p>
					&lt;p&gt;The elements must already be inserted into the document (you can't insert an element before another if it's not in the page).&lt;/p&gt;
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>content (<span class="arg-type" title="">String, Element, jQuery</span>)</span>
    						- 
						Content to insert before each target.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Inserts some HTML before all paragraphs.
					</p>
    <pre>
      <code class="javascript">$("p").before("&lt;b&gt;Hello&lt;/b&gt;");
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt; is what I said...&lt;/p&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Inserts a DOM element before all paragraphs.
					</p>
    <pre>
      <code class="javascript">$("p").before( document.createTextNode("Hello") );
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt; is what I said...&lt;/p&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Inserts a jQuery object (similar to an Array of DOM Elements) before all paragraphs.
					</p>
    <pre>
      <code class="javascript">$("p").before( $("b") );
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt; is what I said...&lt;/p&gt;&lt;b&gt;Hello&lt;/b&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4611974" d:title="Events/bind(type, data, fn)">
    <d:index d:value="bind" d:title="Events/bind(type, data, fn)"/>
    <p class="title">Events/bind(type, data, fn)</p>
    <p>
					Binds a handler to one or more events (like click) for each matched element.  Can also bind custom events.
				</p>
    <p>
					'''Possible event values:''' &lt;code&gt;blur&lt;/code&gt;, &lt;code&gt;focus&lt;/code&gt;, &lt;code&gt;load&lt;/code&gt;, &lt;code&gt;resize&lt;/code&gt;, &lt;code&gt;scroll&lt;/code&gt;, &lt;code&gt;unload&lt;/code&gt;, &lt;code&gt;beforeunload&lt;/code&gt;, &lt;code&gt;click&lt;/code&gt;, &lt;code&gt;dblclick&lt;/code&gt;, &lt;code&gt; mousedown&lt;/code&gt;, &lt;code&gt;mouseup&lt;/code&gt;, &lt;code&gt;mousemove&lt;/code&gt;, &lt;code&gt;mouseover&lt;/code&gt;, &lt;code&gt;mouseout&lt;/code&gt;, &lt;code&gt;mouseenter&lt;/code&gt;, &lt;code&gt;mouseleave&lt;/code&gt;, &lt;code&gt;change&lt;/code&gt;, &lt;code&gt;select&lt;/code&gt;, &lt;code&gt; submit&lt;/code&gt;, &lt;code&gt;keydown&lt;/code&gt;, &lt;code&gt;keypress&lt;/code&gt;, &lt;code&gt;keyup&lt;/code&gt;, &lt;code&gt;error&lt;/code&gt;, &lt;code&gt;ready&lt;/code&gt;<br xmlns=""/><br xmlns=""/>The event handler is passed an 
&lt;a href='Events/jQuery.Event'&gt;event object&lt;/a&gt;					 that you can use to prevent default behaviour. To stop both default action and event bubbling, your handler has to return false. Note that this will prevent handlers on parent elements from running but not other jQuery handlers on the same element. The full list of properties that are available on the event object can be found in the 
&lt;a href='Events/jQuery.Event'&gt;jQuery.Event&lt;/a&gt;					 documentation.<br xmlns=""/><br xmlns=""/>&lt;p&gt;In most cases, you can define your event handlers as anonymous functions (see first example). In cases where that is not possible, you can pass additional data as the second parameter (and the handler function as the third), see second example.&lt;/p&gt;<br xmlns=""/><br xmlns=""/>&lt;p&gt;jQuery also supports 
&lt;a href='Namespaced_Events'&gt;namespaced events&lt;/a&gt;					. These allow you to trigger or unbind specific groups of bound handlers without having to reference them directly.&lt;/p&gt;
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>type (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						One or more event types separated by a space
					</li>
        <li><span>data (<span class="arg-type" title="A simple Javascript object..">Object</span>)</span>
    						- 
						Additional data passed to the event handler as &lt;code&gt;
&lt;a href='Events/jQuery.Event#event.data'&gt;event.data&lt;/a&gt;						&lt;/code&gt;
					</li>
        <li><span>fn (<span class="arg-type" title="A reference to a Javascript function.">Function</span>)</span>
    						- 
						A function to bind to the event on each of the set of matched elements, passed an 
&lt;a href='Events/jQuery.Event'&gt;event object&lt;/a&gt;						.
&lt;pre&gt;function callback(eventObject) {
  this; // dom element
}
&lt;/pre&gt;
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Handle click and double-click for the paragraph.  Note: the coordinates are window relative so in this case relative to the demo iframe.
					</p>
    <pre>
      <code class="javascript">$("p").bind("click", function(
&lt;a href='Events/jQuery.Event'&gt;e&lt;/a&gt;						){
      var str = "( " + e.pageX + ", " + e.pageY + " )";
      $("span").text("Click happened! " + str);
    });
    $("p").bind("dblclick", function(){
      $("span").text("Double-click happened in " + this.tagName);
    });
    $("p").bind("mouseenter mouseleave", function(e){
        $(this).toggleClass("over");
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;Click or double click here.&lt;/p&gt;
  &lt;span&gt;&lt;/span&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						To display each paragraph's text in an alert box whenever it is clicked:
					</p>
    <pre>
      <code class="javascript">$("p").bind("click", function(){
  alert( $(this).text() );
});
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						You can pass some extra data before the event handler:
					</p>
    <pre>
      <code class="javascript">function handler(event) {
  alert(event.data.foo);
}
$("p").bind("click", {foo: "bar"}, handler)
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						To cancel a default action and prevent it from bubbling up, return false:
					</p>
    <pre>
      <code class="javascript">$("form").bind("submit", function() { return false; })
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						To cancel only the default action by using the preventDefault method.
					</p>
    <pre>
      <code class="javascript">$("form").bind("submit", function(event){
  event.preventDefault();
});
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Stop only an event from bubbling by using the stopPropagation method.
					</p>
    <pre>
      <code class="javascript">$("form").bind("submit", function(event){
  if( event.stopPropagation ) { event.stopPropagation(); } //For 'Good' browsers
  else { event.cancelBubble = true; } //For IE
});
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Can bind custom events too.
					</p>
    <pre>
      <code class="javascript">$("p").bind("myCustomEvent", function(e, myName, myValue){
      $(this).text(myName + ", hi there!");
      $("span").stop().css("opacity", 1)
               .text("myName = " + myName)
               .fadeIn(30).fadeOut(1000);
    });
    $("button").click(function () {
      $("p").trigger("myCustomEvent", [ "John" ]);
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;Has an attached custom event.&lt;/p&gt;
  &lt;button&gt;Trigger custom event&lt;/button&gt;
  &lt;span style="display:none;"&gt;&lt;/span&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4613148" d:title="Events/blur()">
    <d:index d:value="blur" d:title="Events/blur()"/>
    <p class="title">Events/blur()</p>
    <p>
					Triggers the blur event of each matched element.
				</p>
    <p>
					This causes all of the functions that have been bound to that blur event to be executed, and calls the browser's default blur action on the matching element(s). This default action can be prevented by returning false from one of the functions bound to the blur event. The blur event usually fires when an element loses focus either via the pointing device or by tabbing navigation
				</p>
    <h2>Example:</h2>
    <p>
						To triggers the blur event on all paragraphs:
					</p>
    <pre>
      <code class="javascript">$("p").blur();
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4613188" d:title="Events/blur(fn)">
    <d:index d:value="blur" d:title="Events/blur(fn)"/>
    <p class="title">Events/blur(fn)</p>
    <p>
					Bind a function to the blur event of each matched element.
				</p>
    <p>
					The blur event fires when an element loses focus either via the pointing device or by tabbing navigation.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>fn (<span class="arg-type" title="A reference to a Javascript function.">Function</span>)</span>
    						- 
						A function to bind to the blur event on each of the matched elements.
&lt;pre&gt;function callback(eventObject) {
  this; // dom element
}
&lt;/pre&gt;
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Fire blur.
					</p>
    <pre>
      <code class="javascript">$("input").blur(function () {
         $(this).next("span").css('display','inline').fadeOut(1000);
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;&lt;input type="text" /&gt; &lt;span&gt;blur fire&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;input type="password" /&gt; &lt;span&gt;blur fire&lt;/span&gt;&lt;/p&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4605565" d:title="Selectors/button()">
    <d:index d:value="button" d:title="Selectors/button()"/>
    <p class="title">Selectors/button()</p>
    <p>
					Matches all button elements and input elements of type button.
				</p>
    <p>
					
				</p>
    <h2>Example:</h2>
    <p>
						Finds all button inputs.
					</p>
    <pre>
      <code class="javascript">var input = $(":button").css({background:"yellow", border:"3px red solid"});
    $("div").text("For this type jQuery found " + input.length + ".")
            .css("color", "red");
    $("form").submit(function () { return false; }); // so it won't submit

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;form&gt;
    &lt;input type="button" value="Input Button"/&gt;
    &lt;input type="checkbox" /&gt;
    &lt;input type="file" /&gt;
    &lt;input type="hidden" /&gt;
    &lt;input type="image" /&gt;
    &lt;input type="password" /&gt;
    &lt;input type="radio" /&gt;
    &lt;input type="reset" /&gt;
    &lt;input type="submit" /&gt;
    &lt;input type="text" /&gt;
    &lt;select&gt;&lt;option&gt;Option&lt;option/&gt;&lt;/select&gt;
    &lt;textarea&gt;&lt;/textarea&gt;
    &lt;button&gt;Button&lt;/button&gt;
  &lt;/form&gt;
  &lt;div&gt;
  &lt;/div&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4613248" d:title="Events/change()">
    <d:index d:value="change" d:title="Events/change()"/>
    <p class="title">Events/change()</p>
    <p>
					Triggers the change event of each matched element.
				</p>
    <p>
					This causes all of the functions that have been bound to that change event to be executed, and calls the browser's default change action on the matching element(s). This default action can be prevented by returning false from one of the functions bound to the change event. The change event usually fires when a control loses the input focus and its value has been modified since gaining focus. 
				</p>
  </d:entry>
  <d:entry id="id4613276" d:title="Events/change(fn)">
    <d:index d:value="change" d:title="Events/change(fn)"/>
    <p class="title">Events/change(fn)</p>
    <p>
					Binds a function to the change event of each matched element.
				</p>
    <p>
					The change event fires when a control loses the input focus and its value has been modified since gaining focus.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>fn (<span class="arg-type" title="A reference to a Javascript function.">Function</span>)</span>
    						- 
						A function to bind to the change event on each of the matched elements.
&lt;pre&gt;function callback(eventObject) {
  this; // dom element
}
&lt;/pre&gt;
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Attaches a change event to the select that gets the text for each selected option and writes them in the div.  It then triggers the event for the initial text draw.
					</p>
    <pre>
      <code class="javascript">$("select").change(function () {
          var str = "";
          $("select option:selected").each(function () {
                str += $(this).text() + " ";
              });
          $("div").text(str);
        })
        .change();

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;select name="sweets" multiple="multiple"&gt;
    &lt;option&gt;Chocolate&lt;/option&gt;
    &lt;option selected="selected"&gt;Candy&lt;/option&gt;
    &lt;option&gt;Taffy&lt;/option&gt;
    &lt;option selected="selected"&gt;Caramel&lt;/option&gt;
    &lt;option&gt;Fudge&lt;/option&gt;
    &lt;option&gt;Cookie&lt;/option&gt;
  &lt;/select&gt;
  &lt;div&gt;&lt;/div&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						To add a validity test to all text input elements:
					</p>
    <pre>
      <code class="javascript">$("input[type='text']").change( function() {
  // check input ($(this).val()) for validity here
});
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4605373" d:title="Selectors/checkbox()">
    <d:index d:value="checkbox" d:title="Selectors/checkbox()"/>
    <p class="title">Selectors/checkbox()</p>
    <p>
					Matches all input elements of type checkbox.
				</p>
    <p>
					Using this psuedo-selector like &lt;code&gt;$(':checkbox')&lt;/code&gt; is equivalent to &lt;code&gt;$('*:checkbox')&lt;/code&gt; which is a slow selector. It's recommended to do &lt;code&gt;$('input:checkbox')&lt;/code&gt;.
				</p>
    <h2>Example:</h2>
    <p>
						Finds all checkbox inputs.
					</p>
    <pre>
      <code class="javascript">var input = $("form :checkbox").wrap('&lt;span&gt;&lt;/span&gt;').parent().css({background:"yellow", border:"3px red solid"});
    $("div").text("For this type jQuery found " + input.length + ".")
            .css("color", "red");
    $("form").submit(function () { return false; }); // so it won't submit

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;form&gt;
    &lt;input type="button" value="Input Button"/&gt;
    &lt;input type="checkbox" /&gt;
    &lt;input type="checkbox" /&gt;
    &lt;input type="file" /&gt;
    &lt;input type="hidden" /&gt;
    &lt;input type="image" /&gt;
    &lt;input type="password" /&gt;
    &lt;input type="radio" /&gt;
    &lt;input type="reset" /&gt;
    &lt;input type="submit" /&gt;
    &lt;input type="text" /&gt;
    &lt;select&gt;&lt;option&gt;Option&lt;option/&gt;&lt;/select&gt;
    &lt;textarea&gt;&lt;/textarea&gt;
    &lt;button&gt;Button&lt;/button&gt;
  &lt;/form&gt;
  &lt;div&gt;
  &lt;/div&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4605754" d:title="Selectors/checked()">
    <d:index d:value="checked" d:title="Selectors/checked()"/>
    <p class="title">Selectors/checked()</p>
    <p>
					Matches all elements that are checked.
				</p>
    <p>
					
				</p>
    <h2>Example:</h2>
    <p>
						Finds all input elements that are checked.
					</p>
    <pre>
      <code class="javascript">function countChecked() {
      var n = $("input:checked").length;
      $("div").text(n + (n &lt;= 1 ? " is" : " are") + " checked!");
    }
    countChecked();
    $(":checkbox").click(countChecked);

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;form&gt;
    &lt;input type="checkbox" name="newsletter" checked="checked" value="Hourly" /&gt;
    &lt;input type="checkbox" name="newsletter" value="Daily" /&gt;
    &lt;input type="checkbox" name="newsletter" value="Weekly" /&gt;
    &lt;input type="checkbox" name="newsletter" checked="checked" value="Monthly" /&gt;
    &lt;input type="checkbox" name="newsletter" value="Yearly" /&gt;
  &lt;/form&gt;
  &lt;div&gt;&lt;/div&gt;
					</code>
    </pre>
    <h3>Result:</h3>
    <pre>
      <code class="html">[ &lt;input type="checkbox" name="newsletter" checked="checked" value="Daily" /&gt;,
  &lt;input type="checkbox" name="newsletter" checked="checked" value="Monthly" /&gt; ]
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4603245" d:title="Selectors/child(parent, child)">
    <d:index d:value="child" d:title="Selectors/child(parent, child)"/>
    <p class="title">Selectors/child(parent, child)</p>
    <p>
					Matches all child elements specified by "child" of elements specified by "parent".
				</p>
    <p>
					
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>parent (<span class="arg-type" title="">Selector</span>)</span>
    						- 
						Any valid selector.
					</li>
        <li><span>child (<span class="arg-type" title="">Selector</span>)</span>
    						- 
						A selector to match elements that are children of the first selector.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Finds all children of the element with id "main" which is yellow.
					</p>
    <pre>
      <code class="javascript">$("#main &gt; *").css("border", "3px double red");
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;span id="main"&gt;
    &lt;div&gt;&lt;/div&gt;
    &lt;button&gt;Child&lt;/button&gt;
    &lt;div class="mini"&gt;&lt;/div&gt;
    &lt;div&gt;
      &lt;div class="mini"&gt;&lt;/div&gt;
      &lt;div class="mini"&gt;&lt;/div&gt;
    &lt;/div&gt;
    &lt;div&gt;&lt;button&gt;Grand&lt;/button&gt;&lt;/div&gt;
    &lt;div&gt;&lt;span&gt;A Span &lt;em&gt;in&lt;/em&gt; child&lt;/span&gt;&lt;/div&gt;
    &lt;span&gt;A Span in main&lt;/span&gt;
  &lt;/span&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4607842" d:title="Traversing/children(expr)">
    <d:index d:value="children" d:title="Traversing/children(expr)"/>
    <p class="title">Traversing/children(expr)</p>
    <p>
					Get a set of elements containing all of the unique immediate children of each of the matched set of elements.
				</p>
    <p>
					This set can be filtered with an optional expression that will cause only elements matching the selector to be collected. Also note: while parents() will look at all ancestors, children() will only consider immediate child elements.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>expr (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						An expression to filter the child Elements with.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Find all children of the clicked element.
					</p>
    <pre>
      <code class="javascript">$("#container").click(function (e) {
      $("*").removeClass("hilite");
      var $kids = $(e.target).children();
      var len = $kids.addClass("hilite").length;

      $("#results span:first").text(len);
      $("#results span:last").text(e.target.tagName);

      e.preventDefault();
      return false;
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div id="container"&gt;
    &lt;div&gt;
      &lt;p&gt;This &lt;span&gt;is the &lt;em&gt;way&lt;/em&gt; we&lt;/span&gt; 
      write &lt;em&gt;the&lt;/em&gt; demo,&lt;/p&gt;
    &lt;/div&gt;
    &lt;div&gt;
      &lt;a href="#"&gt;&lt;b&gt;w&lt;/b&gt;rit&lt;b&gt;e&lt;/b&gt;&lt;/a&gt; the &lt;span&gt;demo,&lt;/span&gt; &lt;button&gt;write 
      the&lt;/button&gt; demo,
    &lt;/div&gt;
    &lt;div&gt;
      This &lt;span&gt;the way we &lt;em&gt;write&lt;/em&gt; the &lt;em&gt;demo&lt;/em&gt; so&lt;/span&gt;
      &lt;input type="text" value="early" /&gt; in
    &lt;/div&gt;
    &lt;p&gt;
      &lt;span&gt;t&lt;/span&gt;he &lt;span&gt;m&lt;/span&gt;orning.
      &lt;span id="results"&gt;Found &lt;span&gt;0&lt;/span&gt; children in &lt;span&gt;TAG&lt;/span&gt;.&lt;/span&gt;
    &lt;/p&gt;
  &lt;/div&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Find all children of each div.
					</p>
    <pre>
      <code class="javascript">$("div").children().css("border-bottom", "3px double red");
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;Hello (this is a paragraph)&lt;/p&gt;
  &lt;div&gt;&lt;span&gt;Hello Again (this span is a child of the a div)&lt;/span&gt;&lt;/div&gt;
  &lt;p&gt;And &lt;span&gt;Again&lt;/span&gt; (in another paragraph)&lt;/p&gt;
  &lt;div&gt;And One Last &lt;span&gt;Time&lt;/span&gt; (most text directly in a div)&lt;/div&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Find all children with a class "selected" of each div.
					</p>
    <pre>
      <code class="javascript">$("div").children(".selected").css("color", "blue");
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div&gt;
    &lt;span&gt;Hello&lt;/span&gt;
    &lt;p class="selected"&gt;Hello Again&lt;/p&gt;
    &lt;div class="selected"&gt;And Again&lt;/div&gt;
    &lt;p&gt;And One Last Time&lt;/p&gt;
  &lt;/div&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4602844" d:title="Selectors/class(class)">
    <d:index d:value="class" d:title="Selectors/class(class)"/>
    <p class="title">Selectors/class(class)</p>
    <p>
					Matches all elements with the given class. 
				</p>
    <p>
					
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>class (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						A class to search for. An element can have multiple classes, one of them must match.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Finds the element with the class "myClass".
					</p>
    <pre>
      <code class="javascript">$(".myClass").css("border","3px solid red");
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div class="notMe"&gt;div class="notMe"&lt;/div&gt;
  &lt;div class="myClass"&gt;div class="myClass"&lt;/div&gt;
  &lt;span class="myClass"&gt;span class="myClass"&lt;/span&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4602906" d:title="Selectors/class(class, class)">
    <d:index d:value="class" d:title="Selectors/class(class, class)"/>
    <p class="title">Selectors/class(class, class)</p>
    <p>
					Matches all elements with the given classes. 
				</p>
    <p>
					
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>class (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						One of the classes to search for. An element can have multiple classes, one of them must match this one.
					</li>
        <li><span>class (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						The other class to search for. An element can have multiple classes, one of them must match this one too.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Finds the element with both classes "myClass" and "myOtherClass".
					</p>
    <pre>
      <code class="javascript">$(".myClass.myOtherClass").css("border","3px solid red");
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div class="myClass"&gt;div class="myClass"&lt;/div&gt;
  &lt;div class="myOtherClass"&gt;div class="myOtherClass"&lt;/div&gt;
  &lt;div class="myClass myOtherClass"&gt;div class="myClass myOtherClass"&lt;/div&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4613358" d:title="Events/click()">
    <d:index d:value="click" d:title="Events/click()"/>
    <p class="title">Events/click()</p>
    <p>
					Triggers the click event of each matched element.
				</p>
    <p>
					Causes all of the functions that have been bound to that click event to be executed.
				</p>
    <h2>Example:</h2>
    <p>
						To trigger the click event on all of the paragraphs on the page:
					</p>
    <pre>
      <code class="javascript">$("p").click();
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4613393" d:title="Events/click(fn)">
    <d:index d:value="click" d:title="Events/click(fn)"/>
    <p class="title">Events/click(fn)</p>
    <p>
					Binds a function to the click event of each matched element.
				</p>
    <p>
					The click event fires when the pointing device button is clicked over an element. A click is defined as a mousedown and mouseup over the same screen location. The sequence of these events is:&lt;ul&gt;&lt;li&gt;mousedown&lt;/li&gt;&lt;li&gt;mouseup&lt;/li&gt;&lt;li&gt;click&lt;/li&gt;&lt;/ul&gt;
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>fn (<span class="arg-type" title="A reference to a Javascript function.">Function</span>)</span>
    						- 
						A function to bind to the click event on each of the matched elements.

Return 'false' or invoke 
&lt;a href='Events/jQuery.Event#event.preventDefault.28.29'&gt;eventObject.preventDefault()&lt;/a&gt;						 to cancel event propagation.  This prevents the browser's default action (such as navigation on a link).
&lt;pre&gt;function callback(eventObject) {
  this; // dom element
}
&lt;/pre&gt;
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						To hide paragraphs on a page when they are clicked:
					</p>
    <pre>
      <code class="javascript">$("p").click(function () { 
      $(this).slideUp(); 
    });
    $("p").hover(function () {
      $(this).addClass("hilite");
    }, function () {
      $(this).removeClass("hilite");
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;First Paragraph&lt;/p&gt;
  &lt;p&gt;Second Paragraph&lt;/p&gt;
  &lt;p&gt;Yet one more Paragraph&lt;/p&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4610700" d:title="Manipulation/clone()">
    <d:index d:value="clone" d:title="Manipulation/clone()"/>
    <p class="title">Manipulation/clone()</p>
    <p>
					Clone matched DOM Elements and select the clones.
				</p>
    <p>
					This is useful for moving copies of the elements to another location in the DOM.
				</p>
    <h2>Example:</h2>
    <p>
						Clones all b elements (and selects the clones) and prepends them to all paragraphs.
					</p>
    <pre>
      <code class="javascript">$("b").clone().prependTo("p");
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;b&gt;Hello&lt;/b&gt;&lt;p&gt;, how are you?&lt;/p&gt;
					</code>
    </pre>
    <h3>Result:</h3>
    <pre>
      <code class="html">&lt;b&gt;Hello&lt;/b&gt;&lt;p&gt;&lt;b&gt;Hello&lt;/b&gt;, how are you?&lt;/p&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4610745" d:title="Manipulation/clone(bool)">
    <d:index d:value="clone" d:title="Manipulation/clone(bool)"/>
    <p class="title">Manipulation/clone(bool)</p>
    <p>
					Clone matched DOM Elements, and all their event handlers, and select the clones.
				</p>
    <p>
					This is useful for moving copies of the elements, and their events, to another location in the DOM.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>bool (<span class="arg-type" title="true or false.">Boolean</span>)</span>
    						- 
						Set to true to enable cloning of event handlers.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Create a button that's able to clone itself - and have the clones themselves be clonable.
					</p>
    <pre>
      <code class="javascript">$("button").click(function(){
      $(this).clone(true).insertAfter(this);
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;button&gt;Clone Me!&lt;/button&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4607955" d:title="Traversing/closest(expr)">
    <d:index d:value="closest" d:title="Traversing/closest(expr)"/>
    <p class="title">Traversing/closest(expr)</p>
    <p>
					'''New in jQuery 1.3''' Get a set of elements containing the closest parent element that matches the specified selector, the starting element included.
				</p>
    <p>
					&lt;p&gt;Closest works by first looking at the current element to see if it matches the specified expression, if so it just returns the element itself. If it doesn't match then it will continue to traverse up the document, parent by parent, until an element is found that matches the specified expression. If no matching element is found then none will be returned.&lt;/p&gt;
&lt;p&gt;Closest is especially useful for dealing with event delegation.&lt;/p&gt;
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>expr (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						An expression to filter the elements with.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Show how event delegation can be done with closest.
					</p>
    <pre>
      <code class="javascript">$(document).bind("click", function (e) {
      $(e.target).closest("li").toggleClass("hilight");
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;ul&gt;
&lt;li&gt;&lt;b&gt;Click me!&lt;/b&gt;&lt;/li&gt;
&lt;li&gt;You can also &lt;b&gt;Click me!&lt;/b&gt;&lt;/li&gt;
&lt;/ul&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4604022" d:title="Selectors/contains(text)">
    <d:index d:value="contains" d:title="Selectors/contains(text)"/>
    <p class="title">Selectors/contains(text)</p>
    <p>
					Matches elements which contain the given text.
				</p>
    <p>
					
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>text (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						A string of text to look for. It's case sensitive.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Finds all divs containing "John" and underlines them.
					</p>
    <pre>
      <code class="javascript">$("div:contains('John')").css("text-decoration", "underline");
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div&gt;John Resig&lt;/div&gt;
  &lt;div&gt;George Martin&lt;/div&gt;
  &lt;div&gt;Malcom John Sinclair&lt;/div&gt;
  &lt;div&gt;J. Ohn
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4608014" d:title="Traversing/contents()">
    <d:index d:value="contents" d:title="Traversing/contents()"/>
    <p class="title">Traversing/contents()</p>
    <p>
					Find all the child nodes inside the matched elements (including text nodes), or the content document, if the element is an iframe.
				</p>
    <p>
					
				</p>
    <h2>Example:</h2>
    <p>
						Find all the text nodes inside a paragraph and wrap them with a bold tag.
					</p>
    <pre>
      <code class="javascript">$("p").contents().filter(function(){ return this.nodeType != 1; }).wrap("&lt;b/&gt;");
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;Hello &lt;a href="http://ejohn.org/"&gt;John&lt;/a&gt;, how are you doing?&lt;/p&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Append some new content into an empty iframe.
					</p>
    <pre>
      <code class="javascript">$("iframe").contents().find("body").append("I'm in an iframe!");
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;iframe src="/index-blank.html" width="300" height="100"&gt;&lt;/iframe&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4601583" d:title="Core/context">
    <d:index d:value="context" d:title="Core/context"/>
    <p class="title">Core/context</p>
    <p>
					&lt;p&gt;'''New in jQuery 1.3''' The DOM node context originally passed to jQuery() (if none was passed then context will be equal to the document).&lt;/p&gt;
				</p>
    <p>
					&lt;p&gt;Should be used in conjunction with selector to determine the exact query used. These two properties are mostly useful to plugin developers.&lt;/p&gt;
				</p>
    <h2>Example:</h2>
    <p>
						Determine the exact context used.
					</p>
    <pre>
      <code class="javascript">$("ul")
  .append("&lt;li&gt;" + $("ul").context + "&lt;/li&gt;")
  .append("&lt;li&gt;" + $("ul", document.body).context.nodeName + "&lt;/li&gt;");

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  Context:&lt;ul&gt;&lt;/ul&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4610807" d:title="CSS/css(name)">
    <d:index d:value="css" d:title="CSS/css(name)"/>
    <p class="title">CSS/css(name)</p>
    <p>
					Return a style property on the first matched element.
				</p>
    <p>
					Shorthand CSS properties (e.g. margin, background, border) are not supported. For example, if you want to retrieve the rendered margin, use: &lt;code&gt;$(elem).css('marginTop')&lt;/code&gt; and &lt;code&gt;$(elem).css('marginRight')&lt;/code&gt;, and so on.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>name (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						The name of the property to access.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						To access the background color of a clicked div.
					</p>
    <pre>
      <code class="javascript">$("div").click(function () {
      var color = $(this).css("background-color");
      $("#result").html("That div is &lt;span style='color:" +
                         color + ";'&gt;" + color + "&lt;/span&gt;.");
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;span id="result"&gt;&amp;nbsp;&lt;/span&gt;
  &lt;div style="background-color:blue;"&gt;&lt;/div&gt;
  &lt;div style="background-color:rgb(15,99,30);"&gt;&lt;/div&gt;
  &lt;div style="background-color:#123456;"&gt;&lt;/div&gt;
  &lt;div style="background-color:#f11;"&gt;&lt;/div&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4610880" d:title="CSS/css(properties)">
    <d:index d:value="css" d:title="CSS/css(properties)"/>
    <p class="title">CSS/css(properties)</p>
    <p>
					Set a key/value object as style properties to all matched elements.
				</p>
    <p>
					This is the best way to set several style properties on all matched elements. <br xmlns=""/><br xmlns=""/>Be aware, however, that when the key contains a hyphen, such as "background-color," it must either be placed within quotation marks or be written in camel case like so: backgroundColor. As "float" and "class" are reserved words in JavaScript, it's recommended to always surround those terms with quotes. jQuery normalizes the "opacity" property in Internet Explorer.<br xmlns=""/><br xmlns=""/>				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>properties (<span class="arg-type" title="A Javascript object that contains key/value pairs in the form of properties and values.">Map</span>)</span>
    						- 
						Key/value pairs to set as style properties.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						To set the color of all paragraphs to red and background to blue:
					</p>
    <pre>
      <code class="javascript">$("p").hover(function () {
      $(this).css({'background-color' : 'yellow', 'font-weight' : 'bolder'});
    }, function () {
      var cssObj = {
        'background-color' : '#ddd',
        'font-weight' : '',
        'color' : 'rgb(0,40,244)'
      }
      $(this).css(cssObj);
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;
    Move the mouse over a paragraph.
  &lt;/p&gt;
  &lt;p&gt;
    Like this one or the one above.
  &lt;/p&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						If the property name includes a "-", put it between quotation marks:
					</p>
    <pre>
      <code class="javascript">$("p").hover(function () {
      $(this).css({ "background-color":"yellow", "font-weight":"bolder" });
    }, function () {
      var cssObj = {
        "background-color": "#ddd",
        "font-weight": "",
        color: "rgb(0,40,244)"
      }
      $(this).css(cssObj);
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;
    Move the mouse over a paragraph.
  &lt;/p&gt;
  &lt;p&gt;
    Like this one or the one above.
  &lt;/p&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4610969" d:title="CSS/css(name, value)">
    <d:index d:value="css" d:title="CSS/css(name, value)"/>
    <p class="title">CSS/css(name, value)</p>
    <p>
					Set a single style property to a value on all matched elements.
				</p>
    <p>
					If a number is provided, it is automatically converted into a pixel value, with the following exceptions: z-index, font-weight, opacity, zoom and line-height). To remove a style property from elements use an empty string value.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>name (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						The name of the property to set.
					</li>
        <li><span>value (<span class="arg-type" title="">String, Number, Callback</span>)</span>
    						- 
						The value to set the property to. In case of a Callback, the context is the to the DOM element to change.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						To change the color of any paragraph to red on mouseover event.
					</p>
    <pre>
      <code class="javascript">$("p").mouseover(function () {
      $(this).css("color","red");
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;
    Just roll the mouse over me.
  &lt;/p&gt;
  &lt;p&gt;
    Or me to see a color change.
  &lt;/p&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						To highlight a clicked word in the paragraph.
					</p>
    <pre>
      <code class="javascript">var words = $("p:first").text().split(" ");
    var text = words.join("&lt;/span&gt; &lt;span&gt;");
    $("p:first").html("&lt;span&gt;" + text + "&lt;/span&gt;");
    $("span").click(function () {
      $(this).css("background-color","yellow");
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;
    Once upon a time there was a man
    who lived in a pizza parlor. This
    man just loved pizza and ate it all 
    the time.  He went on to be the
    happiest man in the world.  The end.
  &lt;/p&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4601941" d:title="Core/data(name)">
    <d:index d:value="data" d:title="Core/data(name)"/>
    <p class="title">Core/data(name)</p>
    <p>
					Returns value at named data store for the element, as set by data(name, value).
				</p>
    <p>
					&lt;p&gt;If the jQuery collection references multiple elements, the value returned refers to the first element.&lt;/p&gt;&lt;p&gt;This function is used to get stored data on an element without the risk of a circular reference.  It uses jQuery.data and is new to version 1.2.3.  It can be used for many reasons and jQuery UI uses it heavily. &lt;/p&gt;
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>name (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						Name of the data stored.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Get the data named "blah" stored at for an element.
					</p>
    <pre>
      <code class="javascript">$("button").click(function(e) {
      var value;

      switch ($("button").index(this)) {
        case 0 :
          value = $("div").data("blah");
          break;
        case 1 :
          $("div").data("blah", "hello");
          value = "Stored!";
          break;
        case 2 :
          $("div").data("blah", 86);
          value = "Stored!";
          break;
        case 3 :
          $("div").removeData("blah");
          value = "Removed!";
          break;
      }

      $("span").text("" + value);
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div&gt;A div&lt;/div&gt;
  &lt;button&gt;Get "blah" from the div&lt;/button&gt;
  &lt;button&gt;Set "blah" to "hello"&lt;/button&gt;
  &lt;button&gt;Set "blah" to 86&lt;/button&gt;
  &lt;button&gt;Remove "blah" from the div&lt;/button&gt;
  &lt;p&gt;The "blah" value of this div is &lt;span&gt;?&lt;/span&gt;&lt;/p&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4602002" d:title="Core/data(name, value)">
    <d:index d:value="data" d:title="Core/data(name, value)"/>
    <p class="title">Core/data(name, value)</p>
    <p>
					Stores the value in the named spot.
				</p>
    <p>
					&lt;p&gt;If the jQuery collection references multiple elements, the data element is set on all of them. A data value that is a Javascript object is not copied and will be shared across all elements in the collection.&lt;/p&gt;&lt;p&gt;This function can be useful for attaching data to elements without having to create a new expando.  It also isn't limited to a string.  The value can be any format.&lt;/p&gt;&lt;p&gt;It may also be used for getting events attached to elements, however this is unsupported. First paramater being the element, second being the string "events"&lt;/p&gt;
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>name (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						Name of the data to store.
					</li>
        <li><span>value (<span class="arg-type" title="">Any</span>)</span>
    						- 
						Value to be stored.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Store then retrieve a value from the div element.
					</p>
    <pre>
      <code class="javascript">$("div").data("test", { first: 16, last: "pizza!" });
    $("span:first").text($("div").data("test").first);
    $("span:last").text($("div").data("test").last);

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div&gt;
    The values stored were 
    &lt;span&gt;&lt;/span&gt;
    and
    &lt;span&gt;&lt;/span&gt;
  &lt;/div&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4666171" d:title="Events/dblclick()">
    <d:index d:value="dblclick" d:title="Events/dblclick()"/>
    <p class="title">Events/dblclick()</p>
    <p>
					Triggers the dblclick event of each matched element.
				</p>
    <p>
					This causes all of the functions that have been bound to that dblclick event to be executed, and calls the browser's default dblclick action on the matching element(s). This default action can be prevented by returning false from one of the functions bound to the dblclick event. The dblclick event usually fires when the pointing device button is double clicked over an element.
				</p>
  </d:entry>
  <d:entry id="id4666197" d:title="Events/dblclick(fn)">
    <d:index d:value="dblclick" d:title="Events/dblclick(fn)"/>
    <p class="title">Events/dblclick(fn)</p>
    <p>
					Binds a function to the dblclick event of each matched element.
				</p>
    <p>
					The dblclick event fires when the pointing device button is double clicked over an element
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>fn (<span class="arg-type" title="A reference to a Javascript function.">Function</span>)</span>
    						- 
						The function to bind to the dblclick event on each of the matched elements.
&lt;pre&gt;function callback(eventObject) {
  this; // dom element
}
&lt;/pre&gt;
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						To bind a "Hello World!" alert box the dblclick event on every paragraph on the page:
					</p>
    <pre>
      <code class="javascript">$("p").dblclick( function () { alert("Hello World!"); });
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Double click to toggle background color.
					</p>
    <pre>
      <code class="javascript">var divdbl = $("div:first");
    divdbl.dblclick(function () { 
      divdbl.toggleClass('dbl'); 
    });


					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div&gt;&lt;/div&gt;&lt;span&gt;Double click the block&lt;/span&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4602341" d:title="Core/dequeue(name)">
    <d:index d:value="dequeue" d:title="Core/dequeue(name)"/>
    <p class="title">Core/dequeue(name)</p>
    <p>
					Removes a queued function from the front of the queue and executes it.
				</p>
    <p>
					
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>name (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						The queue name (fx by default)
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Use dequeue to end a custom queue function which allows the queue to keep going.
					</p>
    <pre>
      <code class="javascript">$("button").click(function () {
      $("div").animate({left:'+=200px'}, 2000);
      $("div").animate({top:'0px'}, 600);
      $("div").queue(function () {
        $(this).toggleClass("red");
         $(this).dequeue();
              });
      $("div").animate({left:'10px', top:'30px'}, 700);
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;button&gt;Start&lt;/button&gt;
  &lt;div&gt;&lt;/div&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4603167" d:title="Selectors/descendant(ancestor, descendant)">
    <d:index d:value="descendant" d:title="Selectors/descendant(ancestor, descendant)"/>
    <p class="title">Selectors/descendant(ancestor, descendant)</p>
    <p>
					Matches a descendant element specified by "descendant" of elements specified by "ancestor".
				</p>
    <p>
					
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>ancestor (<span class="arg-type" title="">Selector</span>)</span>
    						- 
						Any valid selector.
					</li>
        <li><span>descendant (<span class="arg-type" title="">Selector</span>)</span>
    						- 
						A selector to match elements that are descendants of the first selector.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Finds all input descendants of forms.
					</p>
    <pre>
      <code class="javascript">$("form input").css("border", "2px dotted blue");
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;form&gt;
    &lt;div&gt;Form is surrounded by the green outline&lt;/div&gt;
    &lt;label&gt;Child:&lt;/label&gt;
    &lt;input name="name" /&gt;
    &lt;fieldset&gt;
      &lt;label&gt;Grandchild:&lt;/label&gt;
      &lt;input name="newsletter" /&gt;
    &lt;/fieldset&gt;
  &lt;/form&gt;
  Sibling to form: &lt;input name="none" /&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4612799" d:title="Events/die(type , fn )">
    <d:index d:value="die" d:title="Events/die(type , fn )"/>
    <p class="title">Events/die(type , fn )</p>
    <p>
					'''Added in jQuery 1.3:''' This does the opposite of live, it removes a bound live event.
				</p>
    <p>
					&lt;p&gt;Without any arguments, all bound live events are removed.&lt;/p&gt;&lt;p&gt;You can also unbind custom events registered with live.&lt;/p&gt;&lt;p&gt;If the type is provided, all bound live events of that type are removed.&lt;/p&gt;&lt;p&gt;If the function that was passed to live is provided as the second argument, only that specific event handler is removed.&lt;/p&gt;
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>type  (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						A live event type to unbind.
					</li>
        <li><span>fn  (<span class="arg-type" title="A reference to a Javascript function.">Function</span>)</span>
    						- 
						A function to unbind from the event on each of the set of matched elements.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Can bind and unbind events to the colored button.
					</p>
    <pre>
      <code class="javascript">function aClick() {
      $("div").show().fadeOut("slow");
    }
    $("#bind").click(function () {
      $("#theone").live("click", aClick)
                  .text("Can Click!");
    });
    $("#unbind").click(function () {
      $("#theone").die("click", aClick)
                  .text("Does nothing...");
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;button id="theone"&gt;Does nothing...&lt;/button&gt;
  &lt;button id="bind"&gt;Bind Click&lt;/button&gt;
  &lt;button id="unbind"&gt;Unbind Click&lt;/button&gt;
  &lt;div style="display:none;"&gt;Click!&lt;/div&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						To unbind all live events from all paragraphs, write:
					</p>
    <pre>
      <code class="javascript">$("p").die()
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						To unbind all live click events from all paragraphs, write:
					</p>
    <pre>
      <code class="javascript">$("p").die( "click" )
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						To unbind just one previously bound handler, pass the function in as the second argument:
					</p>
    <pre>
      <code class="javascript">var foo = function () {
  // code to handle some kind of event
};

$("p").live("click", foo); // ... now foo will be called when paragraphs are clicked ...

$("p").die("click", foo); // ... foo will no longer be called.
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4605710" d:title="Selectors/disabled()">
    <d:index d:value="disabled" d:title="Selectors/disabled()"/>
    <p class="title">Selectors/disabled()</p>
    <p>
					Matches all elements that are disabled.
				</p>
    <p>
					
				</p>
    <h2>Example:</h2>
    <p>
						Finds all input elements that are disabled.
					</p>
    <pre>
      <code class="javascript">$("input:disabled").val("this is it");
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;form&gt;
    &lt;input name="email" disabled="disabled" /&gt;
    &lt;input name="id" /&gt;
  &lt;/form&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4601182" d:title="Core/each(callback)">
    <d:index d:value="each" d:title="Core/each(callback)"/>
    <p class="title">Core/each(callback)</p>
    <p>
					Execute a function within the context of every matched element.
				</p>
    <p>
					This means that every time the passed-in function is executed (which is once for every element matched) the 'this' keyword points to the specific DOM element. Note that 'this' does ''not'' point to a jQuery object.<br xmlns=""/><br xmlns=""/>Additionally, the function, when executed, is passed a single argument representing the position of the element in the matched set (integer, zero-index).<br xmlns=""/><br xmlns=""/>Returning 'false' from within the each function completely stops the loop through all of the elements (this is like using a 'break' with a normal loop). Returning 'true' from within the loop skips to the next iteration (this is like using a 'continue' with a normal loop). <br xmlns=""/><br xmlns=""/>This function is not the same as 
&lt;a href='Utilities/jQuery.each'&gt;$.each()&lt;/a&gt;					 - which is used to iterate over anything, such as an array or generic object.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>callback (<span class="arg-type" title="A reference to a Javascript function.">Function</span>)</span>
    						- 
						The callback to execute for each matched element.
&lt;pre&gt;function callback(index, domElement) {
  this; // this == domElement
}
&lt;/pre&gt;
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Iterates over three divs and sets their color property.
					</p>
    <pre>
      <code class="javascript">$(document.body).click(function () {
      $("div").each(function (i) {
        if (this.style.color != "blue") {
          this.style.color = "blue";
        } else {
          this.style.color = "";
        }
      });
    });
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div&gt;Click here&lt;/div&gt;
  &lt;div&gt;to iterate through&lt;/div&gt;
  &lt;div&gt;these divs.&lt;/div&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						If you want to have the jQuery object instead of the regular DOM element, use the $(this) function, for example:
					</p>
    <pre>
      <code class="javascript">$("span").click(function () {
      $("li").each(function(){
        $(this).toggleClass("example");
      });
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  To do list: &lt;span&gt;(click here to change)&lt;/span&gt;
  &lt;ul&gt;
    &lt;li&gt;Eat&lt;/li&gt;
    &lt;li&gt;Sleep&lt;/li&gt;
    &lt;li&gt;Be merry&lt;/li&gt;
  &lt;/ul&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						You can use 'return' to break out of each() loops early.
					</p>
    <pre>
      <code class="javascript">$("button").click(function () {
      $("div").each(function (index, domEle) {
        // domEle == this
        $(domEle).css("backgroundColor", "yellow"); 
        if ($(this).is("#stop")) {
          $("span").text("Stopped at div index #" + index);
          return false;
        }
      });
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;button&gt;Change colors&lt;/button&gt; 
  &lt;span&gt;&lt;/span&gt;
  &lt;div&gt;&lt;/div&gt;
  &lt;div&gt;&lt;/div&gt;
  &lt;div&gt;&lt;/div&gt;
  &lt;div&gt;&lt;/div&gt;
  &lt;div id="stop"&gt;Stop here&lt;/div&gt;
  &lt;div&gt;&lt;/div&gt;
  &lt;div&gt;&lt;/div&gt;
  &lt;div&gt;&lt;/div&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4602786" d:title="Selectors/element(element)">
    <d:index d:value="element" d:title="Selectors/element(element)"/>
    <p class="title">Selectors/element(element)</p>
    <p>
					Matches all elements with the given tag name. 
				</p>
    <p>
					
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>element (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						An element to search for. Refers to the tagName of DOM nodes.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Finds every DIV element.
					</p>
    <pre>
      <code class="javascript">$("div").css("border","9px solid red");
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div&gt;DIV1&lt;/div&gt;
  &lt;div&gt;DIV2&lt;/div&gt;
  &lt;span&gt;SPAN&lt;/span&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4604076" d:title="Selectors/empty()">
    <d:index d:value="empty" d:title="Selectors/empty()"/>
    <p class="title">Selectors/empty()</p>
    <p>
					Matches all elements that have no children (including text nodes).
				</p>
    <p>
					
				</p>
    <h2>Example:</h2>
    <p>
						Finds all elements that are empty - they don't have child elements or text.
					</p>
    <pre>
      <code class="javascript">$("td:empty").text("Was empty!").css('background', 'rgb(255,220,200)');
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;table border="1"&gt;
    &lt;tr&gt;&lt;td&gt;TD #0&lt;/td&gt;&lt;td&gt;&lt;/td&gt;&lt;/tr&gt;
    &lt;tr&gt;&lt;td&gt;TD #2&lt;/td&gt;&lt;td&gt;&lt;/td&gt;&lt;/tr&gt;
    &lt;tr&gt;&lt;td&gt;&lt;/td&gt;&lt;td&gt;TD#5&lt;/td&gt;&lt;/tr&gt;
  &lt;/table&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4610558" d:title="Manipulation/empty()">
    <d:index d:value="empty" d:title="Manipulation/empty()"/>
    <p class="title">Manipulation/empty()</p>
    <p>
					Remove all child nodes from the set of matched elements.
				</p>
    <p>
					Note that this function starting with 1.2.2 will also remove all event handlers and internally cached data.
				</p>
    <h2>Example:</h2>
    <p>
						Removes all child nodes (including text nodes) from all paragraphs
					</p>
    <pre>
      <code class="javascript">$("button").click(function () {
      $("p").empty();
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;
    Hello, &lt;span&gt;Person&lt;/span&gt; &lt;a href="javascript:;"&gt;and person&lt;/a&gt;
  &lt;/p&gt;
  &lt;button&gt;Call empty() on above paragraph&lt;/button&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4605668" d:title="Selectors/enabled()">
    <d:index d:value="enabled" d:title="Selectors/enabled()"/>
    <p class="title">Selectors/enabled()</p>
    <p>
					Matches all elements that are enabled.
				</p>
    <p>
					
				</p>
    <h2>Example:</h2>
    <p>
						Finds all input elements that are enabled.
					</p>
    <pre>
      <code class="javascript">$("input:enabled").val("this is it");
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;form&gt;
    &lt;input name="email" disabled="disabled" /&gt;
    &lt;input name="id" /&gt;
  &lt;/form&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4608839" d:title="Traversing/end()">
    <d:index d:value="end" d:title="Traversing/end()"/>
    <p class="title">Traversing/end()</p>
    <p>
					Revert the most recent 'destructive' operation, changing the set of matched elements to its previous state (right before the destructive operation).
				</p>
    <p>
					If there was no destructive operation before, an empty set is returned.<br xmlns=""/><br xmlns=""/>A 'destructive' operation is any operation that changes the set of matched jQuery elements, which means any Traversing function that returns a jQuery object - including 
&lt;a href='Traversing/add'&gt;add&lt;/a&gt;					, 
&lt;a href='Traversing/andSelf'&gt;andSelf&lt;/a&gt;					, 
&lt;a href='Traversing/children'&gt;children&lt;/a&gt;					, 
&lt;a href='Traversing/filter'&gt;filter&lt;/a&gt;					, 
&lt;a href='Traversing/find'&gt;find&lt;/a&gt;					, 
&lt;a href='Traversing/map'&gt;map&lt;/a&gt;					, 
&lt;a href='Traversing/next'&gt;next&lt;/a&gt;					, 
&lt;a href='Traversing/nextAll'&gt;nextAll&lt;/a&gt;					, 
&lt;a href='Traversing/not'&gt;not&lt;/a&gt;					, 
&lt;a href='Traversing/parent'&gt;parent&lt;/a&gt;					, 
&lt;a href='Traversing/parents'&gt;parents&lt;/a&gt;					, 
&lt;a href='Traversing/prev'&gt;prev&lt;/a&gt;					, 
&lt;a href='Traversing/prevAll'&gt;prevAll&lt;/a&gt;					, 
&lt;a href='Traversing/siblings'&gt;siblings&lt;/a&gt;					, and 
&lt;a href='Traversing/slice'&gt;slice&lt;/a&gt;					 - plus the 
&lt;a href='Manipulation/clone'&gt;clone&lt;/a&gt;					, appendTo, prependTo, insertBefore, insertAfter, and replaceAll functions (from Manipulation). 
				</p>
    <h2>Example:</h2>
    <p>
						Selects all paragraphs, finds span elements inside these, and reverts the selection back to the paragraphs.
					</p>
    <pre>
      <code class="javascript">jQuery.fn.showTags = function (n) {
      var tags = this.map(function () { 
                              return this.tagName; 
                            })
                        .get().join(", ");
      $("b:eq(" + n + ")").text(tags);
      return this;
    };

    $("p").showTags(0)
          .find("span")
          .showTags(1)
          .css("background", "yellow")
          .end()
          .showTags(2)
          .css("font-style", "italic");

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;
    Hi there &lt;span&gt;how&lt;/span&gt; are you &lt;span&gt;doing&lt;/span&gt;?
  &lt;/p&gt;
  &lt;p&gt;
    This &lt;span&gt;span&lt;/span&gt; is one of 
    several &lt;span&gt;spans&lt;/span&gt; in this
    &lt;span&gt;sentence&lt;/span&gt;.
  &lt;/p&gt;
  &lt;div&gt;
    Tags in jQuery object initially: &lt;b&gt;&lt;/b&gt;
  &lt;/div&gt;
  &lt;div&gt;
    Tags in jQuery object after find: &lt;b&gt;&lt;/b&gt;
  &lt;/div&gt;
  &lt;div&gt;
    Tags in jQuery object after end: &lt;b&gt;&lt;/b&gt;
  &lt;/div&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Selects all paragraphs, finds span elements inside these, and reverts the selection back to the paragraphs.
					</p>
    <pre>
      <code class="javascript">$("p").find("span").end().css("border", "2px red solid");
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;&lt;span&gt;Hello&lt;/span&gt;, how are you?&lt;/p&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4601640" d:title="Core/eq(position)">
    <d:index d:value="eq" d:title="Core/eq(position)"/>
    <p class="title">Core/eq(position)</p>
    <p>
					Reduce the set of matched elements to a single element.
				</p>
    <p>
					The position of the element in the set of matched elements starts at 0 and goes to length - 1; passing an out-of-range index returns an empty jQuery object.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>position (<span class="arg-type" title="A valid numeric.">Number</span>)</span>
    						- 
						The index of the element to select.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Reduces the selection to the second selected element.
					</p>
    <pre>
      <code class="javascript">$("p").eq(1).css("color", "red")
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;This is just a test.&lt;/p&gt;&lt;p&gt;So is this&lt;/p&gt;
					</code>
    </pre>
    <h3>Result:</h3>
    <pre>
      <code class="html">[ &lt;p&gt;So is this&lt;/p&gt; ]
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4603746" d:title="Selectors/eq(index)">
    <d:index d:value="eq" d:title="Selectors/eq(index)"/>
    <p class="title">Selectors/eq(index)</p>
    <p>
					Matches a single element by its index.
				</p>
    <p>
					
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>index (<span class="arg-type" title="A valid numeric.">Number</span>)</span>
    						- 
						Zero-based index of the element to match.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Finds the third td.
					</p>
    <pre>
      <code class="javascript">$("td:eq(2)").css("color", "red");
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;table border="1"&gt;
    &lt;tr&gt;&lt;td&gt;TD #0&lt;/td&gt;&lt;td&gt;TD #1&lt;/td&gt;&lt;td&gt;TD #2&lt;/td&gt;&lt;/tr&gt;
    &lt;tr&gt;&lt;td&gt;TD #3&lt;/td&gt;&lt;td&gt;TD #4&lt;/td&gt;&lt;td&gt;TD #5&lt;/td&gt;&lt;/tr&gt;
    &lt;tr&gt;&lt;td&gt;TD #6&lt;/td&gt;&lt;td&gt;TD #7&lt;/td&gt;&lt;td&gt;TD #8&lt;/td&gt;&lt;/tr&gt;
  &lt;/table&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4607019" d:title="Traversing/eq(index)">
    <d:index d:value="eq" d:title="Traversing/eq(index)"/>
    <p class="title">Traversing/eq(index)</p>
    <p>
					Reduce the set of matched elements to a single element. 
				</p>
    <p>
					Argument is the position of the element in the set of matched elements, starting at 0 and going to length - 1.  Since the query filters out all elements that do not match the given index, providing an invalid index returns an empty set of elements rather than null.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>index (<span class="arg-type" title="">Integer</span>)</span>
    						- 
						The index of the element in the jQuery object.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Turn the div with index 2 blue by adding an appropriate class.
					</p>
    <pre>
      <code class="javascript">$("div").eq(2).addClass("blue");

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div&gt;&lt;/div&gt;
  &lt;div&gt;&lt;/div&gt;
  &lt;div&gt;&lt;/div&gt;
  &lt;div&gt;&lt;/div&gt;
  &lt;div&gt;&lt;/div&gt;
  &lt;div&gt;&lt;/div&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4666272" d:title="Events/error()">
    <d:index d:value="error" d:title="Events/error()"/>
    <p class="title">Events/error()</p>
    <p>
					Triggers the error event of each matched element.
				</p>
    <p>
					This causes all of the functions that have been bound to that error event to be executed, and calls the browser's default error action on the matching element(s). This default action can be prevented by returning false from one of the functions bound to the error event.
				</p>
  </d:entry>
  <d:entry id="id4666293" d:title="Events/error(fn)">
    <d:index d:value="error" d:title="Events/error(fn)"/>
    <p class="title">Events/error(fn)</p>
    <p>
					Binds a function to the error event of each matched element.
				</p>
    <p>
					&lt;p&gt;(NOTE: Please use the browser's native handling for window.onerror rather than this method; it does not currently work properly.) There is no public standard for the error event. In most browsers, the window object's error event is triggered when a JavaScript error occurs on the page. An image object's error event is triggered when it is set an invalid src attribute - either a non-existent file, or one with corrupt image data.&lt;/p&gt;&lt;p&gt;If the event is thrown by the window object, the event handler will be passed three parameters: &lt;ol&gt;&lt;li&gt;A message describing the event ("varName is not defined", "missing operator in expression", etc.),&lt;/li&gt;&lt;li&gt;the full URL of the document containing the error, and&lt;/li&gt;&lt;li&gt;the line number on which the error occured.&lt;/li&gt;&lt;/ol&gt;&lt;/p&gt;
&lt;p&gt;If the event handler returns true, it signifies that the event was handled, and the browser raises no errors.&lt;/p&gt;&lt;p&gt;For more information, see: &lt;ul&gt;&lt;li&gt;[http://msdn2.microsoft.com/en-us/library/ms536930.aspx msdn - onerror Event]&lt;/li&gt;&lt;li&gt;[http://developer.mozilla.org/en/docs/DOM:window.onerror Gecko DOM Reference - onerror Event]&lt;/li&gt;&lt;li&gt;[http://developer.mozilla.org/en/docs/DOM:event Gecko DOM Reference - Event object]&lt;/li&gt;&lt;li&gt;[http://en.wikipedia.org/wiki/DOM_Events Wikipedia: DOM Events]&lt;/ul&gt;&lt;/p&gt;
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>fn (<span class="arg-type" title="A reference to a Javascript function.">Function</span>)</span>
    						- 
						An event handler function to bind to the error event.
&lt;pre&gt;function callback(eventObject) {
  this; // dom element
}
&lt;/pre&gt;
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						To keep a server-side log of JavaScript errors, you might want to:
					</p>
    <pre>
      <code class="javascript">$(window).error(function(msg, url, line){
  jQuery.post("js_error_log.php", { msg: msg, url: url, line: line });
});
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						To hide JavaScript errors from the user, you can try:
					</p>
    <pre>
      <code class="javascript">$(window).error(function(){
  return true;
});
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						To hide the "broken image" icons for your IE users, you can try:
					</p>
    <pre>
      <code class="javascript">$("img").error(function(){
  $(this).hide();
});
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4603643" d:title="Selectors/even()">
    <d:index d:value="even" d:title="Selectors/even()"/>
    <p class="title">Selectors/even()</p>
    <p>
					Matches even elements, zero-indexed.  See also odd
				</p>
    <p>
					
				</p>
    <h2>Example:</h2>
    <p>
						Finds even table rows, matching the first, third and so on (index 0, 2, 4 etc.).
					</p>
    <pre>
      <code class="javascript">$("tr:even").css("background-color", "#bbbbff");
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;table border="1"&gt;
    &lt;tr&gt;&lt;td&gt;Row with Index #0&lt;/td&gt;&lt;/tr&gt;
    &lt;tr&gt;&lt;td&gt;Row with Index #1&lt;/td&gt;&lt;/tr&gt;
    &lt;tr&gt;&lt;td&gt;Row with Index #2&lt;/td&gt;&lt;/tr&gt;
    &lt;tr&gt;&lt;td&gt;Row with Index #3&lt;/td&gt;&lt;/tr&gt;
  &lt;/table&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4668505" d:title="Effects/fadeIn(speed, callback)">
    <d:index d:value="fadeIn" d:title="Effects/fadeIn(speed, callback)"/>
    <p class="title">Effects/fadeIn(speed, callback)</p>
    <p>
					Fade in all matched elements by adjusting their opacity and firing an optional callback after completion.
				</p>
    <p>
					Only the opacity is adjusted for this animation, meaning that all of the matched elements should already have some form of height and width associated with them.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>speed (<span class="arg-type" title="">String, Number </span>)</span>
    						- 
						A string representing one of the three predefined speeds ("slow", "def", or "fast") or the number of milliseconds to run the animation (e.g. 1000).  As of jQuery 1.2.6, "normal" or any other string works the same as "def" (400ms).
					</li>
        <li><span>callback (<span class="arg-type" title="A reference to a Javascript function.">Function</span>)</span>
    						- 
						A function to be executed whenever the animation completes, executes once for each element animated against.
&lt;pre&gt;function callback() {
  this; // dom element
}
&lt;/pre&gt;
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Animates hidden divs to fade in one by one, completing each animation within 600 milliseconds.
					</p>
    <pre>
      <code class="javascript">$(document.body).click(function () {
      $("div:hidden:first").fadeIn("slow");
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;span&gt;Click here...&lt;/span&gt;
  &lt;div id="one"&gt;&lt;/div&gt;
  &lt;div id="two"&gt;&lt;/div&gt;
  &lt;div id="three"&gt;&lt;/div&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Fades a red block in over the text. Once the animation is done, it quickly fades in more text on top.
					</p>
    <pre>
      <code class="javascript">$("a").click(function () {
      $("div").fadeIn(3000, function () {
        $("span").fadeIn(100);
      });
      return false;
    }); 

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;
    Let it be known that the party of the first part
    and the party of the second part are henceforth
    and hereto directed to assess the allegations
    for factual correctness... (&lt;a href="#"&gt;click!&lt;/a&gt;)
    &lt;div&gt;&lt;span&gt;CENSORED!&lt;/span&gt;&lt;/div&gt;
  &lt;/p&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4668618" d:title="Effects/fadeOut(speed, callback)">
    <d:index d:value="fadeOut" d:title="Effects/fadeOut(speed, callback)"/>
    <p class="title">Effects/fadeOut(speed, callback)</p>
    <p>
					Fade out all matched elements by adjusting their opacity to 0, then setting display to "none" and firing an optional callback after completion.
				</p>
    <p>
					Only the opacity is adjusted for this animation, meaning that all of the matched elements should already have some form of height and width associated with them.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>speed (<span class="arg-type" title="">String, Number </span>)</span>
    						- 
						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).
					</li>
        <li><span>callback (<span class="arg-type" title="A reference to a Javascript function.">Function</span>)</span>
    						- 
						A function to be executed whenever the animation completes, executes once for each element animated against.
&lt;pre&gt;function callback() {
  this; // dom element
}
&lt;/pre&gt;
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Animates all paragraphs to fade out, completing the animation within 600 milliseconds.
					</p>
    <pre>
      <code class="javascript">$("p").click(function () {
      $("p").fadeOut("slow");
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;
    If you click on this paragraph
    you'll see it just fade away.
  &lt;/p&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Fades out spans in one section that you click on.
					</p>
    <pre>
      <code class="javascript">$("span").click(function () {
      $(this).fadeOut(1000, function () {
        $("div").text("'" + $(this).text() + "' has faded!");
        $(this).remove();
      });
    });
    $("span").hover(function () {
      $(this).addClass("hilite");
    }, function () {
      $(this).removeClass("hilite");
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;h3&gt;Find the modifiers - &lt;div&gt;&lt;/div&gt;&lt;/h3&gt;
  &lt;p&gt;
    If you &lt;span&gt;really&lt;/span&gt; want to go outside
    &lt;span&gt;in the cold&lt;/span&gt; then make sure to wear
    your &lt;span&gt;warm&lt;/span&gt; jacket given to you by
    your &lt;span&gt;favorite&lt;/span&gt; teacher.
  &lt;/p&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4668731" d:title="Effects/fadeTo(speed, opacity, callback)">
    <d:index d:value="fadeTo" d:title="Effects/fadeTo(speed, opacity, callback)"/>
    <p class="title">Effects/fadeTo(speed, opacity, callback)</p>
    <p>
					Fade the opacity of all matched elements to a specified opacity and firing an optional callback after completion.
				</p>
    <p>
					Only the opacity is adjusted for this animation, meaning that all of the matched elements should already have some form of height and width associated with them.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>speed (<span class="arg-type" title="">String, Number </span>)</span>
    						- 
						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).
					</li>
        <li><span>opacity (<span class="arg-type" title="">Number </span>)</span>
    						- 
						The opacity to fade to (a number from 0 to 1).
					</li>
        <li><span>callback (<span class="arg-type" title="A reference to a Javascript function.">Function</span>)</span>
    						- 
						A function to be executed whenever the animation completes, executed once for each element animated against.
&lt;pre&gt;function callback() {
  this; // dom element
}
&lt;/pre&gt;
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Animates first paragraph to fade to an opacity of 0.33 (33%, about one third visible), completing the animation within 600 milliseconds.
					</p>
    <pre>
      <code class="javascript">$("p:first").click(function () {
      $(this).fadeTo("slow", 0.33);
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;
    Click this paragraph to see it fade.
  &lt;/p&gt;
  &lt;p&gt;
    Compare to this one that won't fade.
  &lt;/p&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Fade div to a random opacity on each click, completing the animation within 200 milliseconds.
					</p>
    <pre>
      <code class="javascript">$("div").click(function () {
      $(this).fadeTo("fast", Math.random());
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;And this is the library that John built...&lt;/p&gt;
  &lt;div id="one"&gt;&lt;/div&gt;
  &lt;div id="two"&gt;&lt;/div&gt;
  &lt;div id="three"&gt;&lt;/div&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Find the right answer!  The fade will take 250 milliseconds and change various styles when it completes.
					</p>
    <pre>
      <code class="javascript">var getPos = function (n) {
      return (Math.floor(n) * 90) + "px";
    };
    $("p").each(function (n) {
      var r = Math.floor(Math.random() * 3);
      var tmp = $(this).text();
      $(this).text($("p:eq(" + r + ")").text());
      $("p:eq(" + r + ")").text(tmp);
      $(this).css("left", getPos(n));
    });
    $("div").each(function (n) {
                  $(this).css("left", getPos(n));
                })
            .css("cursor", "pointer")
            .click(function () {
                  $(this).fadeTo(250, 0.25, function () {
                        $(this).css("cursor", "")
                               .prev().css({"font-weight": "bolder",
                                            "font-style": "italic"});
                      });
                });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;Wrong&lt;/p&gt;
  &lt;div&gt;&lt;/div&gt;
  &lt;p&gt;Wrong&lt;/p&gt;
  &lt;div&gt;&lt;/div&gt;
  &lt;p&gt;Right!&lt;/p&gt;
  &lt;div&gt;&lt;/div&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4605614" d:title="Selectors/file()">
    <d:index d:value="file" d:title="Selectors/file()"/>
    <p class="title">Selectors/file()</p>
    <p>
					Matches all input elements of type file.
				</p>
    <p>
					
				</p>
    <h2>Example:</h2>
    <p>
						Finds all file inputs.
					</p>
    <pre>
      <code class="javascript">var input = $(":file").css({background:"yellow", border:"3px red solid"});
    $("div").text("For this type jQuery found " + input.length + ".")
            .css("color", "red");
    $("form").submit(function () { return false; }); // so it won't submit

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;form&gt;
    &lt;input type="button" value="Input Button"/&gt;
    &lt;input type="checkbox" /&gt;
    &lt;input type="file" /&gt;
    &lt;input type="hidden" /&gt;
    &lt;input type="image" /&gt;
    &lt;input type="password" /&gt;
    &lt;input type="radio" /&gt;
    &lt;input type="reset" /&gt;
    &lt;input type="submit" /&gt;
    &lt;input type="text" /&gt;
    &lt;select&gt;&lt;option&gt;Option&lt;option/&gt;&lt;/select&gt;
    &lt;textarea&gt;&lt;/textarea&gt;
    &lt;button&gt;Button&lt;/button&gt;
  &lt;/form&gt;
  &lt;div&gt;
  &lt;/div&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4607082" d:title="Traversing/filter(expr)">
    <d:index d:value="filter" d:title="Traversing/filter(expr)"/>
    <p class="title">Traversing/filter(expr)</p>
    <p>
					Keeps only the elements from the set of matched elements that match the specified expression(s). 
				</p>
    <p>
					This method is used to narrow down the results of a search.<br xmlns=""/><br xmlns=""/>Provide a comma-separated list of expressions to apply multiple filters at once (e.g. filter(".class1, .class2")).
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>expr (<span class="arg-type" title="">Expression</span>)</span>
    						- 
						An expression to pass into the filter
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Change the color of all divs then put a border around only some of them.
					</p>
    <pre>
      <code class="javascript">$("div").css("background", "#c8ebcc")
            .filter(".middle")
            .css("border-color", "red");

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div&gt;&lt;/div&gt;
  &lt;div class="middle"&gt;&lt;/div&gt;
  &lt;div class="middle"&gt;&lt;/div&gt;
  &lt;div class="middle"&gt;&lt;/div&gt;
  &lt;div class="middle"&gt;&lt;/div&gt;
  &lt;div&gt;&lt;/div&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Selects all paragraphs and removes those without a class "selected".
					</p>
    <pre>
      <code class="javascript">$("p").filter(".selected")
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Selects all paragraphs and removes those that aren't of class "selected" or the first one.
					</p>
    <pre>
      <code class="javascript">$("p").filter(".selected, :first")
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4607167" d:title="Traversing/filter(fn)">
    <d:index d:value="filter" d:title="Traversing/filter(fn)"/>
    <p class="title">Traversing/filter(fn)</p>
    <p>
					Keeps only the elements from the set of matched elements where the specified function returns a non-false value. 
				</p>
    <p>
					The function is called with a context equal to the current element (just like 
&lt;a href='Core/each'&gt;$.each&lt;/a&gt;					). If the function returns false, then the element is removed - anything else and the element is kept in the resulting set of matched elements.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>fn (<span class="arg-type" title="A reference to a Javascript function.">Function</span>)</span>
    						- 
						A function to pass into the filter
&lt;pre&gt;function callback(indexInJQueryObject) {
  var keepItBoolean = true;

  this; // dom element

  return keepItBoolean;
}
&lt;/pre&gt;
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Change the color of all divs then put a border to specific ones.
					</p>
    <pre>
      <code class="javascript">$("div").css("background", "#b4b0da")
            .filter(function (index) {
                  return index == 1 || $(this).attr("id") == "fourth";
                })
            .css("border", "3px double red");

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div id="first"&gt;&lt;/div&gt;
  &lt;div id="second"&gt;&lt;/div&gt;
  &lt;div id="third"&gt;&lt;/div&gt;
  &lt;div id="fourth"&gt;&lt;/div&gt;
  &lt;div id="fifth"&gt;&lt;/div&gt;
  &lt;div id="sixth"&gt;&lt;/div&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Remove all elements that have a descendant ol element
					</p>
    <pre>
      <code class="javascript">$("div").filter(function(index) {
   return $("ol", this).length == 0;
 });
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4608072" d:title="Traversing/find(expr)">
    <d:index d:value="find" d:title="Traversing/find(expr)"/>
    <p class="title">Traversing/find(expr)</p>
    <p>
					Searches for descendent elements that match the specified 
&lt;a href='Selectors'&gt;expression&lt;/a&gt;					. 
				</p>
    <p>
					All searching is done using a 
&lt;a href='Selectors'&gt;jQuery expression&lt;/a&gt;					. The expression can be written using CSS 1-3 Selector syntax. This does not search the selected elements, only their descendants. To choose a subset of the elements in the jQuery object, use 
&lt;a href='Traversing/filter'&gt;filter&lt;/a&gt;					 instead.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>expr (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						An expression to search with.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Starts with all paragraphs and searches for descendant span elements, same as $("p span")
					</p>
    <pre>
      <code class="javascript">$("p").find("span").css('color','red');
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;&lt;span&gt;Hello&lt;/span&gt;, how are you?&lt;/p&gt;
  &lt;p&gt;Me? I'm &lt;span&gt;good&lt;/span&gt;.&lt;/p&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Add spans around each word then add a hover and italicize words with the letter '''t'''.
					</p>
    <pre>
      <code class="javascript">var newText = $("p").text().split(" ").join("&lt;/span&gt; &lt;span&gt;");
    newText = "&lt;span&gt;" + newText + "&lt;/span&gt;";

    $("p").html(newText)
          .find("span")
            .hover(function () { $(this).addClass("hilite"); },
                   function () { $(this).removeClass("hilite"); })
          .end()
          .find(":contains('t')")
            .css({"font-style":"italic", "font-weight":"bolder"});

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;
    When the day is short
    find that which matters to you
    or stop believing
  &lt;/p&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4603481" d:title="Selectors/first()">
    <d:index d:value="first" d:title="Selectors/first()"/>
    <p class="title">Selectors/first()</p>
    <p>
					Matches the first selected element.
				</p>
    <p>
					While this matches only a single element, 
&lt;a href='Selectors/firstChild'&gt;:first-child&lt;/a&gt;					 matches more than one: One for each parent.
				</p>
    <h2>Example:</h2>
    <p>
						Finds the first table row.
					</p>
    <pre>
      <code class="javascript">$("tr:first").css("font-style", "italic");
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;table&gt;
    &lt;tr&gt;&lt;td&gt;Row 1&lt;/td&gt;&lt;/tr&gt;
    &lt;tr&gt;&lt;td&gt;Row 2&lt;/td&gt;&lt;/tr&gt;
    &lt;tr&gt;&lt;td&gt;Row 3&lt;/td&gt;&lt;/tr&gt;
  &lt;/table&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4604992" d:title="Selectors/firstChild()">
    <d:index d:value="firstChild" d:title="Selectors/firstChild()"/>
    <p class="title">Selectors/firstChild()</p>
    <p>
					Matches all elements that are the first child of their parent.
				</p>
    <p>
					While 
&lt;a href='Selectors/first'&gt;:first&lt;/a&gt;					 matches only a single element, this matches more than one: One for each parent.
				</p>
    <h2>Example:</h2>
    <p>
						Finds the first span in each matched div to underline and add a hover state.
					</p>
    <pre>
      <code class="javascript">$("div span:first-child")
        .css("text-decoration", "underline")
        .hover(function () {
              $(this).addClass("sogreen");
            }, function () {
              $(this).removeClass("sogreen");
            });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div&gt;
    &lt;span&gt;John,&lt;/span&gt;
    &lt;span&gt;Karl,&lt;/span&gt;
    &lt;span&gt;Brandon&lt;/span&gt;
  &lt;/div&gt;
  &lt;div&gt;
    &lt;span&gt;Glen,&lt;/span&gt;
    &lt;span&gt;Tane,&lt;/span&gt;
    &lt;span&gt;Ralph&lt;/span&gt;
  &lt;/div&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4666366" d:title="Events/focus()">
    <d:index d:value="focus" d:title="Events/focus()"/>
    <p class="title">Events/focus()</p>
    <p>
					Triggers the focus event of each matched element. 
				</p>
    <p>
					This causes all of the functions that have been bound to the focus event to be executed. Note that this does not execute the focus method of the underlying elements.
				</p>
    <h2>Example:</h2>
    <p>
						To focus on a login input box with id 'login' on page startup, try:
					</p>
    <pre>
      <code class="javascript">$(document).ready(function(){
  $("#login").focus();
});
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4666401" d:title="Events/focus(fn)">
    <d:index d:value="focus" d:title="Events/focus(fn)"/>
    <p class="title">Events/focus(fn)</p>
    <p>
					Binds a function to the focus event of each matched element.
				</p>
    <p>
					The focus event fires when an element receives focus either via the pointing device or by tab navigation.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>fn (<span class="arg-type" title="A reference to a Javascript function.">Function</span>)</span>
    						- 
						A function to bind to the focus event on each of the matched elements.
&lt;pre&gt;function callback(eventObject) {  
this; // dom element
}
&lt;/pre&gt;
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Fire focus.
					</p>
    <pre>
      <code class="javascript">$("input").focus(function () {
         $(this).next("span").css('display','inline').fadeOut(1000);
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;&lt;input type="text" /&gt; &lt;span&gt;focus fire&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;input type="password" /&gt; &lt;span&gt;focus fire&lt;/span&gt;&lt;/p&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						To stop people from writing in text input boxes, try:
					</p>
    <pre>
      <code class="javascript">$("input[type=text]").focus(function(){
  $(this).blur();
});
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4601706" d:title="Core/get()">
    <d:index d:value="get" d:title="Core/get()"/>
    <p class="title">Core/get()</p>
    <p>
					Access all matched DOM elements.
				</p>
    <p>
					This serves as a backwards-compatible way of accessing all matched elements (other than the jQuery object itself, which is, in fact, an array of elements).<br xmlns=""/><br xmlns=""/>It is useful if you need to operate on the DOM elements themselves instead of using built-in jQuery functions. 
				</p>
    <h2>Example:</h2>
    <p>
						Selects all divs in the document and returns the DOM Elements as an Array, then uses the built-in reverse-method to reverse that array.
					</p>
    <pre>
      <code class="javascript">function disp(divs) {
      var a = [];
      for (var i = 0; i &lt; divs.length; i++) {
        a.push(divs[i].innerHTML);
      }
      $("span").text(a.join(" "));
    }
    
    disp( $("div").get().reverse() );

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  Reversed - &lt;span&gt;&lt;/span&gt;
  &lt;div&gt;One&lt;/div&gt;
  &lt;div&gt;Two&lt;/div&gt;
  &lt;div&gt;Three&lt;/div&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4601756" d:title="Core/get(index)">
    <d:index d:value="get" d:title="Core/get(index)"/>
    <p class="title">Core/get(index)</p>
    <p>
					Access a single matched DOM element at a specified index in the matched set.
				</p>
    <p>
					This allows you to extract the actual DOM element and operate on it directly without necessarily using jQuery functionality on it. This function called as $(this).get(0) is the equivalent of using square bracket notation on the jQuery object itself like $(this)[0].
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>index (<span class="arg-type" title="A valid numeric.">Number</span>)</span>
    						- 
						Access the element in the Nth position.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Gives the tag name of the element clicked on.
					</p>
    <pre>
      <code class="javascript">$("*", document.body).click(function (e) {
      e.stopPropagation();
      var domEl = $(this).get(0);
      $("span:first").text("Clicked on - " + domEl.tagName);
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;span&gt;&amp;nbsp;&lt;/span&gt;
  &lt;p&gt;In this paragraph is an &lt;span&gt;important&lt;/span&gt; section&lt;/p&gt;
  &lt;div&gt;&lt;input type="text" /&gt;&lt;/div&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4603802" d:title="Selectors/gt(index)">
    <d:index d:value="gt" d:title="Selectors/gt(index)"/>
    <p class="title">Selectors/gt(index)</p>
    <p>
					Matches all elements with an index above the given one.
				</p>
    <p>
					
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>index (<span class="arg-type" title="A valid numeric.">Number</span>)</span>
    						- 
						Zero-based index.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Finds TD #5 and higher. Reminder: the indexing starts at 0.
					</p>
    <pre>
      <code class="javascript">$("td:gt(4)").css("text-decoration", "line-through");
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;table border="1"&gt;
    &lt;tr&gt;&lt;td&gt;TD #0&lt;/td&gt;&lt;td&gt;TD #1&lt;/td&gt;&lt;td&gt;TD #2&lt;/td&gt;&lt;/tr&gt;
    &lt;tr&gt;&lt;td&gt;TD #3&lt;/td&gt;&lt;td&gt;TD #4&lt;/td&gt;&lt;td&gt;TD #5&lt;/td&gt;&lt;/tr&gt;
    &lt;tr&gt;&lt;td&gt;TD #6&lt;/td&gt;&lt;td&gt;TD #7&lt;/td&gt;&lt;td&gt;TD #8&lt;/td&gt;&lt;/tr&gt;
  &lt;/table&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4604130" d:title="Selectors/has(selector)">
    <d:index d:value="has" d:title="Selectors/has(selector)"/>
    <p class="title">Selectors/has(selector)</p>
    <p>
					Matches elements which contain at least one element that matches the specified selector.
				</p>
    <p>
					
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>selector (<span class="arg-type" title="">Selector</span>)</span>
    						- 
						A selector with which to filter by.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Adds the class "test" to all divs that have a paragraph inside of them.
					</p>
    <pre>
      <code class="javascript">$("div:has(p)").addClass("test");
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div&gt;&lt;p&gt;Hello in a paragraph&lt;/p&gt;&lt;/div&gt;
  &lt;div&gt;Hello again! (with no paragraph)&lt;/div&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4606276" d:title="Attributes/hasClass(class)">
    <d:index d:value="hasClass" d:title="Attributes/hasClass(class)"/>
    <p class="title">Attributes/hasClass(class)</p>
    <p>
					Returns true if the specified class is present on at least one of the set of matched elements.
				</p>
    <p>
					
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>class (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						One CSS class name to be checked for.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Looks for the class 'selected' on the matched elements.
					</p>
    <pre>
      <code class="javascript">$("div#result1").append($("p:first").hasClass("selected").toString());
$("div#result2").append($("p:last").hasClass("selected").toString());
$("div#result3").append($("p").hasClass("selected").toString());
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;Hello&lt;/p&gt;
  &lt;p class="selected"&gt;Goodbye&lt;/p&gt;
  &lt;div id="result1"&gt;First paragraph has selected class: &lt;/div&gt;
  &lt;div id="result2"&gt;Last paragraph has selected class: &lt;/div&gt;
  &lt;div id="result3"&gt;Some paragraph has selected class: &lt;/div&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4603917" d:title="Selectors/header()">
    <d:index d:value="header" d:title="Selectors/header()"/>
    <p class="title">Selectors/header()</p>
    <p>
					Matches all elements that are headers, like h1, h2, h3 and so on.
				</p>
    <p>
					
				</p>
    <h2>Example:</h2>
    <p>
						Adds a background and text color to all the headers on the page.
					</p>
    <pre>
      <code class="javascript">$(":header").css({ background:'#CCC', color:'blue' });
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;h1&gt;Header 1&lt;/h1&gt;
  &lt;p&gt;Contents 1&lt;/p&gt;
  &lt;h2&gt;Header 2&lt;/h2&gt;
  &lt;p&gt;Contents 2&lt;/p&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4611426" d:title="CSS/height()">
    <d:index d:value="height" d:title="CSS/height()"/>
    <p class="title">CSS/height()</p>
    <p>
					Get the current computed, pixel, height of the first matched element.
				</p>
    <p>
					In jQuery 1.2, this method is able to find the height of the window and document.<br xmlns=""/><br xmlns=""/>&lt;pre&gt;
$(window).height();   // returns height of browser viewport
$(document).height(); // returns height of HTML document
&lt;/pre&gt;
				</p>
    <h2>Example:</h2>
    <p>
						Show various heights.  Note the values are from the iframe so might be smaller than you expected.  The yellow highlight shows the iframe body.
					</p>
    <pre>
      <code class="javascript">function showHeight(ele, h) {
      $("div").text("The height for the " + ele + 
                    " is " + h + "px.");
    }
    $("#getp").click(function () { 
      showHeight("paragraph", $("p").height()); 
    });
    $("#getd").click(function () { 
      showHeight("document", $(document).height()); 
    });
    $("#getw").click(function () { 
      showHeight("window", $(window).height()); 
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;button id="getp"&gt;Get Paragraph Height&lt;/button&gt;
  &lt;button id="getd"&gt;Get Document Height&lt;/button&gt;
  &lt;button id="getw"&gt;Get Window Height&lt;/button&gt;
  &lt;div&gt;&amp;nbsp;&lt;/div&gt;
  &lt;p&gt;
    Sample paragraph to test height
  &lt;/p&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4611486" d:title="CSS/height(val)">
    <d:index d:value="height" d:title="CSS/height(val)"/>
    <p class="title">CSS/height(val)</p>
    <p>
					Set the CSS height of every matched element.
				</p>
    <p>
					If no explicit unit was specified (like 'em' or '%') then "px" is concatenated to the value.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>val (<span class="arg-type" title="">String, Number</span>)</span>
    						- 
						Set the CSS 'height' property to the specified value.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						To set the height of each div on click to 30px plus a color change.
					</p>
    <pre>
      <code class="javascript">$("div").one('click', function () {
      $(this).height(30)
             .css({cursor:"auto", backgroundColor:"green"});
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div&gt;&lt;/div&gt;
  &lt;div&gt;&lt;/div&gt;
  &lt;div&gt;&lt;/div&gt;
  &lt;div&gt;&lt;/div&gt;
  &lt;div&gt;&lt;/div&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4604244" d:title="Selectors/hidden()">
    <d:index d:value="hidden" d:title="Selectors/hidden()"/>
    <p class="title">Selectors/hidden()</p>
    <p>
					Matches all elements that are hidden.
				</p>
    <p>
					How :hidden is calculated was changed in jQuery 1.3.2. Element assumed as hidden if it or its parents consumes no space in document. CSS visibility isn't taken into account. The [http://docs.jquery.com/Release:jQuery_1.3.2#:visible.2F:hidden_Overhauled release notes] outline the changes in more detail.
				</p>
    <h2>Example:</h2>
    <p>
						Shows all hidden divs and counts hidden inputs.
					</p>
    <pre>
      <code class="javascript">// in some browsers :hidden includes head, title, script, etc... so limit to body
    $("span:first").text("Found " + $(":hidden", document.body).length + 
                         " hidden elements total.");
    $("div:hidden").show(3000);
    $("span:last").text("Found " + $("input:hidden").length + " hidden inputs.");

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;span&gt;&lt;/span&gt;
  &lt;div&gt;&lt;/div&gt;
  &lt;div style="display:none;"&gt;Hider!&lt;/div&gt;
  &lt;div&gt;&lt;/div&gt;
  &lt;div class="starthidden"&gt;Hider!&lt;/div&gt;
  &lt;div&gt;&lt;/div&gt;
  &lt;form&gt;
    &lt;input type="hidden" /&gt;
    &lt;input type="hidden" /&gt;
    &lt;input type="hidden" /&gt;
  &lt;/form&gt;
  &lt;span&gt;
  &lt;/span&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4667798" d:title="Effects/hide()">
    <d:index d:value="hide" d:title="Effects/hide()"/>
    <p class="title">Effects/hide()</p>
    <p>
					Hides each of the set of matched elements if they are shown.
				</p>
    <p>
					Same as 
&lt;a href='Effects/hide#speedcallback'&gt;hide( speed, [callback] )&lt;/a&gt;					 without animations. Doesn't change anything if the selected elements are all hidden.
				</p>
    <h2>Example:</h2>
    <p>
						Hides all paragraphs then the link on click.
					</p>
    <pre>
      <code class="javascript">$("p").hide();
    $("a").click(function () {
      $(this).hide();
      return true;
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;Hello&lt;/p&gt;
  &lt;a href="#"&gt;Click to hide me too&lt;/a&gt;
  &lt;p&gt;Here is another paragraph&lt;/p&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4667842" d:title="Effects/hide(speed, callback)">
    <d:index d:value="hide" d:title="Effects/hide(speed, callback)"/>
    <p class="title">Effects/hide(speed, callback)</p>
    <p>
					Hide all matched elements using a graceful animation and firing an optional callback after completion.
				</p>
    <p>
					&lt;p&gt;The height, width, and opacity of each of the matched elements are changed dynamically according to the specified speed. As of jQuery 1.3 the padding and margin are also animated, creating a smoother effect.&lt;/p&gt;
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>speed (<span class="arg-type" title="">String, Number </span>)</span>
    						- 
						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).
					</li>
        <li><span>callback (<span class="arg-type" title="A reference to a Javascript function.">Function</span>)</span>
    						- 
						A function to be executed whenever the animation completes, executes once for each element animated against.
&lt;pre&gt;function callback() {
  this; // dom element
}
&lt;/pre&gt;
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Animates all shown paragraphs to hide slowly, completing the animation within 600 milliseconds.
					</p>
    <pre>
      <code class="javascript">$("button").click(function () {
      $("p").hide("slow");
    });    

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;button&gt;Hide 'em&lt;/button&gt;
  &lt;p&gt;Hiya&lt;/p&gt;
  &lt;p&gt;Such interesting text, eh?&lt;/p&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Animates all spans (words in this case) to hide fastly, completing each animation within 200 milliseconds. Once each animation is done, it starts the next one.
					</p>
    <pre>
      <code class="javascript">$("#hidr").click(function () {
      $("span:last-child").hide("fast", function () {
        // use callee so don't have to name the function
        $(this).prev().hide("fast", arguments.callee); 
      });
    });
    $("#showr").click(function () {
      $("span").show(2000);
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;button id="hidr"&gt;Hide&lt;/button&gt;
  &lt;button id="showr"&gt;Show&lt;/button&gt;
  &lt;div&gt;
    &lt;span&gt;Once&lt;/span&gt; &lt;span&gt;upon&lt;/span&gt; &lt;span&gt;a&lt;/span&gt; 
    &lt;span&gt;time&lt;/span&gt; &lt;span&gt;there&lt;/span&gt; &lt;span&gt;were&lt;/span&gt; 
    &lt;span&gt;three&lt;/span&gt; &lt;span&gt;programmers...&lt;/span&gt;
  &lt;/div&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Hides the divs when clicked over 2 seconds, then removes the div element when its hidden.  Try clicking on more than one box at a time.
					</p>
    <pre>
      <code class="javascript">for (var i = 0; i &lt; 5; i++) {
      $("&lt;div&gt;").appendTo(document.body);
    }
    $("div").click(function () {
      $(this).hide(2000, function () {
        $(this).remove();
      });
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div&gt;&lt;/div&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4612930" d:title="Events/hover(over, out)">
    <d:index d:value="hover" d:title="Events/hover(over, out)"/>
    <p class="title">Events/hover(over, out)</p>
    <p>
					Simulates hovering (moving the mouse on, and off, an object). This is a custom method which provides an 'in' to a frequent task.
				</p>
    <p>
					Whenever the mouse cursor is moved over a matched element, the first specified function is fired. Whenever the mouse moves off of the element, the second specified function fires. Additionally, checks are in place to see if the mouse is still within the specified element itself (for example, an image inside of a div), and if it is, it will continue to 'hover', and not move out (a common error in using a mouseout event handler).
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>over (<span class="arg-type" title="A reference to a Javascript function.">Function</span>)</span>
    						- 
						The function to fire when the mouse is moved over a matched element.
&lt;pre&gt;function callback(eventObject) {
  this; // dom element
}
&lt;/pre&gt;
					</li>
        <li><span>out (<span class="arg-type" title="A reference to a Javascript function.">Function</span>)</span>
    						- 
						The function to fire when the mouse is moved off of a matched element.
&lt;pre&gt;function callback(eventObject) {
  this; // dom element
}
&lt;/pre&gt;
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						To add a special style to list items that are being hovered over, try:
					</p>
    <pre>
      <code class="javascript">$("li").hover(
      function () {
        $(this).append($("&lt;span&gt; ***&lt;/span&gt;"));
      }, 
      function () {
        $(this).find("span:last").remove();
      }
    );


   
  //li with fade class
   $("li.fade").hover(function(){$(this).fadeOut(100);$(this).fadeIn(500);});

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;ul&gt;
    &lt;li&gt;Milk&lt;/li&gt;
    &lt;li&gt;Bread&lt;/li&gt;
    &lt;li class='fade'&gt;Chips&lt;/li&gt;
    &lt;li class='fade'&gt;Socks&lt;/li&gt;
  &lt;/ul&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						To add a special style to table cells that are being hovered over, try:
					</p>
    <pre>
      <code class="javascript">$("td").hover(
  function () {
    $(this).addClass("hover");
  },
  function () {
    $(this).removeClass("hover");
  }
);
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						To unbind the above example use:
					</p>
    <pre>
      <code class="javascript">$("td").unbind('mouseenter mouseleave');
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4606567" d:title="Attributes/html()">
    <d:index d:value="html" d:title="Attributes/html()"/>
    <p class="title">Attributes/html()</p>
    <p>
					Get the html contents (innerHTML) of the first matched element. This property is not available on XML documents (although it will work for XHTML documents).
				</p>
    <p>
					
				</p>
    <h2>Example:</h2>
    <p>
						Click a paragraph to convert it from html to text.
					</p>
    <pre>
      <code class="javascript">$("p").click(function () {
      var htmlStr = $(this).html();
      $(this).text(htmlStr);
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;
    &lt;b&gt;Click&lt;/b&gt; to change the &lt;span id="tag"&gt;html&lt;/span&gt;
  &lt;/p&gt;
  &lt;p&gt;
    to a &lt;span id="text"&gt;text&lt;/span&gt; node.
  &lt;/p&gt;
  &lt;p&gt;
    This &lt;button name="nada"&gt;button&lt;/button&gt; does nothing.
  &lt;/p&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4608975" d:title="Attributes/html()">
    <d:index d:value="html" d:title="Attributes/html()"/>
    <p class="title">Attributes/html()</p>
    <p>
					Get the html contents (innerHTML) of the first matched element. This property is not available on XML documents (although it will work for XHTML documents).
				</p>
    <p>
					
				</p>
    <h2>Example:</h2>
    <p>
						Click a paragraph to convert it from html to text.
					</p>
    <pre>
      <code class="javascript">$("p").click(function () {
      var htmlStr = $(this).html();
      $(this).text(htmlStr);
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;
    &lt;b&gt;Click&lt;/b&gt; to change the &lt;span id="tag"&gt;html&lt;/span&gt;
  &lt;/p&gt;
  &lt;p&gt;
    to a &lt;span id="text"&gt;text&lt;/span&gt; node.
  &lt;/p&gt;
  &lt;p&gt;
    This &lt;button name="nada"&gt;button&lt;/button&gt; does nothing.
  &lt;/p&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4606615" d:title="Attributes/html(val)">
    <d:index d:value="html" d:title="Attributes/html(val)"/>
    <p class="title">Attributes/html(val)</p>
    <p>
					Set the html contents of every matched element. This property is not available on XML documents (although it will work for XHTML documents).
				</p>
    <p>
					
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>val (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						Set the html contents to the specified value.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Add some html to each div.
					</p>
    <pre>
      <code class="javascript">$("div").html("&lt;span class='red'&gt;Hello &lt;b&gt;Again&lt;/b&gt;&lt;/span&gt;");
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;span&gt;Hello&lt;/span&gt;
  &lt;div&gt;&lt;/div&gt;
  &lt;div&gt;&lt;/div&gt;
  &lt;div&gt;&lt;/div&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Add some html to each div then immediately do further manipulations to the inserted html.
					</p>
    <pre>
      <code class="javascript">$("div").html("&lt;b&gt;Wow!&lt;/b&gt; Such excitement...");
    $("div b").append(document.createTextNode("!!!"))
              .css("color", "red");

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div&gt;&lt;/div&gt;
  &lt;div&gt;&lt;/div&gt;
  &lt;div&gt;&lt;/div&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4609023" d:title="Attributes/html(val)">
    <d:index d:value="html" d:title="Attributes/html(val)"/>
    <p class="title">Attributes/html(val)</p>
    <p>
					Set the html contents of every matched element. This property is not available on XML documents (although it will work for XHTML documents).
				</p>
    <p>
					
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>val (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						Set the html contents to the specified value.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Add some html to each div.
					</p>
    <pre>
      <code class="javascript">$("div").html("&lt;span class='red'&gt;Hello &lt;b&gt;Again&lt;/b&gt;&lt;/span&gt;");
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;span&gt;Hello&lt;/span&gt;
  &lt;div&gt;&lt;/div&gt;
  &lt;div&gt;&lt;/div&gt;
  &lt;div&gt;&lt;/div&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Add some html to each div then immediately do further manipulations to the inserted html.
					</p>
    <pre>
      <code class="javascript">$("div").html("&lt;b&gt;Wow!&lt;/b&gt; Such excitement...");
    $("div b").append(document.createTextNode("!!!"))
              .css("color", "red");

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div&gt;&lt;/div&gt;
  &lt;div&gt;&lt;/div&gt;
  &lt;div&gt;&lt;/div&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4602700" d:title="Selectors/id(id)">
    <d:index d:value="id" d:title="Selectors/id(id)"/>
    <p class="title">Selectors/id(id)</p>
    <p>
					Matches a single element with the given id attribute. 
				</p>
    <p>
					If the id contains characters like periods or colons you have to escape those characters with backslashes [http://docs.jquery.com/Frequently_Asked_Questions#How_do_I_select_an_element_that_has_weird_characters_in_its_ID.3F].
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>id (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						An ID to search for, specified via the id attribute of an element.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Finds the element with the id "myDiv".
					</p>
    <pre>
      <code class="javascript">$("#myDiv").css("border","3px solid red");
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div id="notMe"&gt;&lt;p&gt;id="notMe"&lt;/p&gt;&lt;/div&gt;
  &lt;div id="myDiv"&gt;id="myDiv"&lt;/div&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Finds the element with the id "myID.entry[1]".  See how certain characters must be escaped with backslashes.
					</p>
    <pre>
      <code class="javascript">$("#myID\\.entry\\[1\\]").css("border","3px solid red");
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div id="myID.entry[0]"&gt;id="myID.entry[0]"&lt;/div&gt;
  &lt;div id="myID.entry[1]"&gt;id="myID.entry[1]"&lt;/div&gt;
  &lt;div id="myID.entry[2]"&gt;id="myID.entry[2]"&lt;/div&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4605468" d:title="Selectors/image()">
    <d:index d:value="image" d:title="Selectors/image()"/>
    <p class="title">Selectors/image()</p>
    <p>
					Matches all input elements of type image.
				</p>
    <p>
					
				</p>
    <h2>Example:</h2>
    <p>
						Finds all image inputs.
					</p>
    <pre>
      <code class="javascript">var input = $(":image").css({background:"yellow", border:"3px red solid"});
    $("div").text("For this type jQuery found " + input.length + ".")
            .css("color", "red");
    $("form").submit(function () { return false; }); // so it won't submit

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;form&gt;
    &lt;input type="button" value="Input Button"/&gt;
    &lt;input type="checkbox" /&gt;
    &lt;input type="file" /&gt;
    &lt;input type="hidden" /&gt;
    &lt;input type="image" /&gt;
    &lt;input type="password" /&gt;
    &lt;input type="radio" /&gt;
    &lt;input type="reset" /&gt;
    &lt;input type="submit" /&gt;
    &lt;input type="text" /&gt;
    &lt;select&gt;&lt;option&gt;Option&lt;option/&gt;&lt;/select&gt;
    &lt;textarea&gt;&lt;/textarea&gt;
    &lt;button&gt;Button&lt;/button&gt;
  &lt;/form&gt;
  &lt;div&gt;
  &lt;/div&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4601816" d:title="Core/index(subject)">
    <d:index d:value="index" d:title="Core/index(subject)"/>
    <p class="title">Core/index(subject)</p>
    <p>
					Searches every matched element for the object and returns the index of the element, if found, starting with zero. If a jQuery object is passed, only the first element is checked.
				</p>
    <p>
					Returns -1 if the object wasn't found.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>subject (<span class="arg-type" title="">Element,jQuery</span>)</span>
    						- 
						Object to search for.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						On click, returns the index (based zero) of that div in the page.
					</p>
    <pre>
      <code class="javascript">$("div").click(function () {
      // this is the dom element clicked
      var index = $("div").index(this);
      $("span").text("That was div index #" + index);
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;span&gt;Click a div!&lt;/span&gt;
  &lt;div&gt;First div&lt;/div&gt;
  &lt;div&gt;Second div&lt;/div&gt;
  &lt;div&gt;Third div&lt;/div&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Returns the index for the element with ID foobar.
					</p>
    <pre>
      <code class="javascript">$("*").index( $('#foobar')[0] )
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div id="foobar"&gt;&lt;b&gt;&lt;/b&gt;&lt;span id="foo"&gt;&lt;/span&gt;&lt;/div&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Returns the index for the element with ID foo within another element.
					</p>
    <pre>
      <code class="javascript">$("*").index( $('#foo') )
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div id="foobar"&gt;&lt;b&gt;&lt;/b&gt;&lt;span id="foo"&gt;&lt;/span&gt;&lt;/div&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Returns the index for the element clicked within a collection.
					</p>
    <pre>
      <code class="javascript">var mainNavLinks = $('ul#mainNav li a');
mainNavLinks.click(function(){alert(mainNavLinks.index(this));});
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Returns -1, as there is no element with ID bar.
					</p>
    <pre>
      <code class="javascript">$("*").index( $('#bar')[0] )
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div id="foobar"&gt;&lt;b&gt;&lt;/b&gt;&lt;span id="foo"&gt;&lt;/span&gt;&lt;/div&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4611665" d:title="CSS/innerHeight()">
    <d:index d:value="innerHeight" d:title="CSS/innerHeight()"/>
    <p class="title">CSS/innerHeight()</p>
    <p>
					Gets the inner height (excludes the border and includes the padding) for the first matched element.
				</p>
    <p>
					This method works for both visible and hidden elements. It is not supported for elements that are indirectly hidden by consequence of a parent being hidden. Please use .height() for the window and document.
				</p>
    <h2>Example:</h2>
    <p>
						Get innerHeight
					</p>
    <pre>
      <code class="javascript">var p = $("p:first");
$("p:last").text( "innerHeight:" + p.innerHeight() );

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;Hello&lt;/p&gt;&lt;p&gt;&lt;/p&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4611705" d:title="CSS/innerWidth()">
    <d:index d:value="innerWidth" d:title="CSS/innerWidth()"/>
    <p class="title">CSS/innerWidth()</p>
    <p>
					Gets the inner width (excludes the border and includes the padding) for the first matched element.
				</p>
    <p>
					 This method works for both visible and hidden elements. It is not supported for elements that are indirectly hidden by consequence of a parent being hidden. Please use .width() for the window and document.
				</p>
    <h2>Example:</h2>
    <p>
						Get innerWidth
					</p>
    <pre>
      <code class="javascript">var p = $("p:first");
$("p:last").text( "innerWidth:" + p.innerWidth() );

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;Hello&lt;/p&gt;&lt;p&gt;&lt;/p&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4605177" d:title="Selectors/input()">
    <d:index d:value="input" d:title="Selectors/input()"/>
    <p class="title">Selectors/input()</p>
    <p>
					Matches all input, textarea, select and button elements.
				</p>
    <p>
					
				</p>
    <h2>Example:</h2>
    <p>
						Finds all input elements.
					</p>
    <pre>
      <code class="javascript">var allInputs = $(":input");
    var formChildren = $("form &gt; *");
    $("#messages").text("Found " + allInputs.length + " inputs and the form has " +
                             formChildren.length + " children.");
			
	// so it won't submit
    $("form").submit(function () { return false; }); 

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;form&gt;
    &lt;input type="button" value="Input Button"/&gt;
    &lt;input type="checkbox" /&gt;
    &lt;input type="file" /&gt;
    &lt;input type="hidden" /&gt;
    &lt;input type="image" /&gt;
    &lt;input type="password" /&gt;
    &lt;input type="radio" /&gt;
    &lt;input type="reset" /&gt;
    &lt;input type="submit" /&gt;
    &lt;input type="text" /&gt;
    &lt;select&gt;&lt;option&gt;Option&lt;/option&gt;&lt;/select&gt;
    &lt;textarea&gt;&lt;/textarea&gt;
    &lt;button&gt;Button&lt;/button&gt;
  &lt;/form&gt;
  &lt;div id="messages"&gt;
  &lt;/div&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4609737" d:title="Manipulation/insertAfter(selector)">
    <d:index d:value="insertAfter" d:title="Manipulation/insertAfter(selector)"/>
    <p class="title">Manipulation/insertAfter(selector)</p>
    <p>
					Insert all of the matched elements after another, specified, set of elements. As of jQuery 1.3.2, returns all of the inserted elements.
				</p>
    <p>
					
&lt;p&gt;The elements must already be inserted into the document (you can't insert an element after another if it's not in the page).&lt;/p&gt;
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>selector (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						Content after which the selected element(s) is inserted.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Inserts all paragraphs after an element with id of "foo". Same as $("#foo").after("p")
					</p>
    <pre>
      <code class="javascript">$("p").insertAfter("#foo"); // check after() examples
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt; is what I said... &lt;/p&gt;&lt;div id="foo"&gt;FOO!&lt;/div&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4609798" d:title="Manipulation/insertBefore(selector)">
    <d:index d:value="insertBefore" d:title="Manipulation/insertBefore(selector)"/>
    <p class="title">Manipulation/insertBefore(selector)</p>
    <p>
					Insert all of the matched elements before another, specified, set of elements. As of jQuery 1.3.2, returns all of the inserted elements.
				</p>
    <p>
					&lt;p&gt;This operation is, essentially, the reverse of doing a regular $(A).before(B), in that instead of inserting B before A, you're inserting A before B.&lt;/p&gt;
&lt;p&gt;The elements must already be inserted into the document (you can't insert an element after another if it's not in the page).&lt;/p&gt;
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>selector (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						Content after which the selected element(s) is inserted.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Inserts all paragraphs before an element with id of "foo". Same as $("#foo").before("p")
					</p>
    <pre>
      <code class="javascript">$("p").insertBefore("#foo"); // check before() examples
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div id="foo"&gt;FOO!&lt;/div&gt;&lt;p&gt;I would like to say: &lt;/p&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4607258" d:title="Traversing/is(expr)">
    <d:index d:value="is" d:title="Traversing/is(expr)"/>
    <p class="title">Traversing/is(expr)</p>
    <p>
					Checks the current selection against an expression and returns true, if at least one element of the selection fits the given expression.
				</p>
    <p>
					&lt;p&gt;If no element fits, or the expression is not valid, then the response will be 'false'.&lt;/p&gt;
&lt;p&gt;'''Note''': As of jQuery 1.3 all expressions are supported. Previously complex expressions, such as those containing hierarchy selectors (such as +, ~, and &gt;), always returned 'true'.&lt;/p&gt;<br xmlns=""/><br xmlns=""/>&lt;p&gt;
&lt;a href='Traversing/filter'&gt;filter&lt;/a&gt;					 is used internally, therefore all rules that apply there apply here, as well.&lt;/p&gt;
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>expr (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						The expression with which to filter
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Shows a few ways is() can be used inside an event handler.
					</p>
    <pre>
      <code class="javascript">$("div").one('click', function () {
      if ($(this).is(":first-child")) {
        $("p").text("It's the first div.");
      } else if ($(this).is(".blue,.red")) {
        $("p").text("It's a blue or red div.");
      } else if ($(this).is(":contains('Peter')")) {
        $("p").text("It's Peter!");
      } else {
        $("p").html("It's nothing &lt;em&gt;special&lt;/em&gt;.");
      }
      $("p").hide().slideDown("slow");
      $(this).css({"border-style": "inset", cursor:"default"});
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div&gt;&lt;/div&gt;
  &lt;div class="blue"&gt;&lt;/div&gt;
  &lt;div&gt;&lt;/div&gt;
  &lt;div class="red"&gt;&lt;/div&gt;
  &lt;div&gt;&lt;br/&gt;&lt;span&gt;Peter&lt;/span&gt;&lt;/div&gt;
  &lt;div class="blue"&gt;&lt;/div&gt;
  &lt;p&gt;&amp;nbsp;&lt;/p&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Returns true, because the parent of the input is a form element
					</p>
    <pre>
      <code class="javascript">var isFormParent = $("input[type='checkbox']").parent().is("form")
    $("div").text("isFormParent = " + isFormParent);

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;form&gt;&lt;input type="checkbox" /&gt;&lt;/form&gt;
  &lt;div&gt;&lt;/div&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Returns false, because the parent of the input is a p element
					</p>
    <pre>
      <code class="javascript">var isFormParent = $("input[type='checkbox']").parent().is("form")
    $("div").text("isFormParent = " + isFormParent);

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;form&gt;&lt;p&gt;&lt;input type="checkbox" /&gt;&lt;/p&gt;&lt;/form&gt;
  &lt;div&gt;&lt;/div&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4601056" d:title="Core/jQuery(elements)">
    <d:index d:value="jQuery" d:title="Core/jQuery(elements)"/>
    <p class="title">Core/jQuery(elements)</p>
    <p>
					Wrap jQuery functionality around a single or an array of DOM Element(s).
				</p>
    <p>
					This function accepts XML Documents and Window objects as valid arguments even though they are not DOM Elements. It will also accept another jQuery object, effectively returning $(other.get()).
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>elements (<span class="arg-type" title="">Element, Array&lt;Element&gt;</span>)</span>
    						- 
						DOM element(s) to be encapsulated by a jQuery object.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Sets the background color of the page to black.
					</p>
    <pre>
      <code class="javascript">$(document.body).css( "background", "black" );
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Hides all the input elements within a form.
					</p>
    <pre>
      <code class="javascript">$(myForm.elements).hide()
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4601118" d:title="Core/jQuery(callback)">
    <d:index d:value="jQuery" d:title="Core/jQuery(callback)"/>
    <p class="title">Core/jQuery(callback)</p>
    <p>
					A shorthand for $(document).ready().
				</p>
    <p>
					Allows you to bind a function to be executed when the DOM document has finished loading. This function behaves just like $(document).ready(), in that it should be used to wrap other $() operations on your page that depend on the DOM being ready to be operated on. While this function is, technically, chainable - there really isn't much use for chaining against it.<br xmlns=""/><br xmlns=""/>You can have as many $(document).ready events on your page as you like.<br xmlns=""/><br xmlns=""/>See ready(Function) for details about the ready event. 
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>callback (<span class="arg-type" title="A reference to a Javascript function.">Function</span>)</span>
    						- 
						The function to execute when the DOM is ready.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Executes the function when the DOM is ready to be used.
					</p>
    <pre>
      <code class="javascript">$(function(){
  // Document is ready
});
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Uses both the shortcut for $(document).ready() and the argument to write failsafe jQuery code using the $ alias, without relying on the global alias.
					</p>
    <pre>
      <code class="javascript">jQuery(function($) {
  // Your code using failsafe $ alias here...
});
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4600896" d:title="Core/jQuery(expression, context)">
    <d:index d:value="jQuery" d:title="Core/jQuery(expression, context)"/>
    <p class="title">Core/jQuery(expression, context)</p>
    <p>
					This function accepts a string containing a CSS selector which is then used to match a set of elements.
				</p>
    <p>
					The core functionality of jQuery centers around this function. Everything in jQuery is based upon this, or uses this in some way. The most basic use of this function is to pass in an expression (usually consisting of CSS), which then finds all matching elements.<br xmlns=""/><br xmlns=""/>By default, if no context is specified, $() looks for DOM elements within the context of the current HTML document. If you do specify a context, such as a DOM element or jQuery object, the expression will be matched against the contents of that context.<br xmlns=""/><br xmlns=""/>See 
&lt;a href='Selectors'&gt;Selectors&lt;/a&gt;					 for the allowed CSS syntax for expressions. 
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>expression (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						An expression to search with.
					</li>
        <li><span>context (<span class="arg-type" title="">Element, jQuery</span>)</span>
    						- 
						A DOM Element, Document or jQuery to use as context
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Finds all p elements that are children of a div element.
					</p>
    <pre>
      <code class="javascript">$("div &gt; p").css("border", "1px solid gray");
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;one&lt;/p&gt; &lt;div&gt;&lt;p&gt;two&lt;/p&gt;&lt;/div&gt; &lt;p&gt;three&lt;/p&gt;
					</code>
    </pre>
    <h3>Result:</h3>
    <pre>
      <code class="html">[ &lt;p&gt;two&lt;/p&gt; ]
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Finds all inputs of type radio within the first form in the document.
					</p>
    <pre>
      <code class="javascript">$("input:radio", document.forms[0]);
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Finds all div elements within an XML document from an AJAX response.
					</p>
    <pre>
      <code class="javascript">$("div", xml.responseXML);
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4600993" d:title="Core/jQuery(html, ownerDocument)">
    <d:index d:value="jQuery" d:title="Core/jQuery(html, ownerDocument)"/>
    <p class="title">Core/jQuery(html, ownerDocument)</p>
    <p>
					Create DOM elements on-the-fly from the provided String of raw HTML.
				</p>
    <p>
					&lt;p&gt;Simple elements without attributes, e.g., "&amp;lt;div /&amp;gt;", are created via document.createElement. All other cases are parsed by assigning the string to the .innerHTML property of a div element. The HTML string cannot contain elements that are invalid within a div, such as html, head, body, or title elements.&lt;/p&gt;&lt;p&gt;All HTML must be well-formed, otherwise it may not work correctly across all browsers. This includes the case where &lt;code&gt;$("&amp;lt;span&amp;gt;")&lt;/code&gt; may not work but &lt;code&gt;$("&amp;lt;span/&amp;gt;")&lt;/code&gt; will (note the XML-style closing slash).&lt;/p&gt;
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>html (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						A string of HTML to create on the fly. Note that this parses HTML, *not* XML.
					</li>
        <li><span>ownerDocument (<span class="arg-type" title="">document</span>)</span>
    						- 
						A document in which the new elements will be created
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Creates a div element (and all of its contents) dynamically, and appends it to the body element. Internally, an element is created and its innerHTML property set to the given markup. It is therefore both quite flexible and limited.
					</p>
    <pre>
      <code class="javascript">$("&lt;div&gt;&lt;p&gt;Hello&lt;/p&gt;&lt;/div&gt;").appendTo("body")
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4669430" d:title="Ajax/jQuery.ajax(options)">
    <d:index d:value="jQuery.ajax" d:title="Ajax/jQuery.ajax(options)"/>
    <p class="title">Ajax/jQuery.ajax(options)</p>
    <p>
					Load a remote page using an HTTP request.
				</p>
    <p>
					This is jQuery's low-level AJAX implementation. See $.get, $.post etc. for higher-level abstractions that are often easier to understand and use, but don't offer as much functionality (such as error callbacks).<br xmlns=""/><br xmlns=""/>$.ajax() returns the XMLHttpRequest that it creates. In most cases you won't need that object to manipulate directly, but it is available if you need to abort the request manually.<br xmlns=""/><br xmlns=""/>$.ajax() takes one argument, an object of key/value pairs, that are used to initialize and handle the request. See the Options tab for a full list of the key/values that can be used.<br xmlns=""/><br xmlns=""/>'''Note:''' If you specify the dataType option, described in the Options section, make sure
the server sends the correct MIME type in the response (eg. xml as "text/xml").
Sending the wrong MIME type can lead to unexpected problems in your script.
See 
&lt;a href='Specifying_the_Data_Type_for_AJAX_Requests'&gt;Specifying the Data Type for AJAX Requests&lt;/a&gt;					 for more information.<br xmlns=""/><br xmlns=""/>'''Note:''' All remote (not on the same domain) requests should be specified as GET when 'script' or 'jsonp' is the dataType (because it loads script using a DOM script tag). Ajax options that require an XMLHttpRequest object are not available for these requests. The complete and success functions are called on completion, but do not receive an XHR object; the beforeSend and dataFilter functions are not called.<br xmlns=""/><br xmlns=""/>As of jQuery 1.2, you can load JSON data located on another domain if you specify a [http://bob.pythonmac.org/archives/2005/12/05/remote-json-jsonp/ JSONP] callback, which can be done like so: "myurl?callback=?". jQuery automatically replaces the ? with the correct method name to call, calling your specified callback. Or, if you set the dataType to "jsonp" a callback will be automatically added to your Ajax request.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>options (<span class="arg-type" title="">Options</span>)</span>
    						- 
						A set of key/value pairs that configure the Ajax request. All options are optional. A default can be set for any option with 
&lt;a href='Ajax/jQuery.ajaxSetup'&gt;$.ajaxSetup&lt;/a&gt;						().
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Load and execute a JavaScript file.
					</p>
    <pre>
      <code class="javascript">$.ajax({
   type: "GET",
   url: "test.js",
   dataType: "script"
 });
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Save some data to the server and notify the user once it's complete.
					</p>
    <pre>
      <code class="javascript">$.ajax({
   type: "POST",
   url: "some.php",
   data: "name=John&amp;location=Boston",
   success: function(msg){
     alert( "Data Saved: " + msg );
   }
 });
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Retrieve the latest version of an HTML page.
					</p>
    <pre>
      <code class="javascript">$.ajax({
  url: "test.html",
  cache: false,
  success: function(html){
    $("#results").append(html);
  }
});
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Loads data synchronously. Blocks the browser while the requests is active.
It is better to block user interaction by other means when synchronization is
necessary.
					</p>
    <pre>
      <code class="javascript">var html = $.ajax({
  url: "some.php",
  async: false
 }).responseText;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Sends an xml document as data to the server. By setting the processData
option to false, the automatic conversion of data to strings is prevented.
					</p>
    <pre>
      <code class="javascript">var xmlDocument = [create xml document];
 $.ajax({
   url: "page.php",
   processData: false,
   data: xmlDocument,
   success: handleResponse
 });
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Sends an id as data to the server, save some data to the server and notify the user once it's complete.
					</p>
    <pre>
      <code class="javascript">bodyContent = $.ajax({
      url: "script.php",
      global: false,
      type: "POST",
      data: ({id : this.getAttribute('id')}),
      dataType: "html",
      success: function(msg){
         alert(msg);
      }
   }
).responseText;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4671167" d:title="Ajax/jQuery.ajaxSetup(options)">
    <d:index d:value="jQuery.ajaxSetup" d:title="Ajax/jQuery.ajaxSetup(options)"/>
    <p class="title">Ajax/jQuery.ajaxSetup(options)</p>
    <p>
					Setup global settings for AJAX requests.
				</p>
    <p>
					See 
&lt;a href='Ajax/jQuery.ajax'&gt;$.ajax&lt;/a&gt;					 for a description of all available options. Note: Do not set handlers for complete, error, or success functions with this method; use the global ajax events instead.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>options (<span class="arg-type" title="">Options</span>)</span>
    						- 
						A set of key/value pairs that configure the default Ajax request. All options are optional. 
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Sets the defaults for AJAX requests to the url "/xmlhttp/", disables global handlers and uses POST instead of GET. The following AJAX requests then sends some data without having to set anything else.
					</p>
    <pre>
      <code class="javascript">$.ajaxSetup({
   url: "/xmlhttp/",
   global: false,
   type: "POST"
 });
 $.ajax({ data: myData });
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4671642" d:title="Utilities/jQuery.boxModel">
    <d:index d:value="jQuery.boxModel" d:title="Utilities/jQuery.boxModel"/>
    <p class="title">Utilities/jQuery.boxModel</p>
    <p>
					'''Deprecated in jQuery 1.3 (see jQuery.support)''' States if the current page, in the user's browser, is being rendered using the [http://www.w3.org/TR/REC-CSS2/box.html W3C CSS Box Model].
				</p>
    <p>
					
				</p>
    <h2>Example:</h2>
    <p>
						Returns the box model for the iframe.
					</p>
    <pre>
      <code class="javascript">$("p").html("The box model for this iframe is: &lt;span&gt;" +
                jQuery.boxModel + "&lt;/span&gt;");

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;
  &lt;/p&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Returns false if the page is in QuirksMode in Internet Explorer
					</p>
    <pre>
      <code class="javascript">$.boxModel
					</code>
    </pre>
    <h3>Result:</h3>
    <pre>
      <code class="html">false
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4671427" d:title="Utilities/jQuery.browser">
    <d:index d:value="jQuery.browser" d:title="Utilities/jQuery.browser"/>
    <p class="title">Utilities/jQuery.browser</p>
    <p>
					'''We recommend against using this property, please try to use feature detection instead (see jQuery.support).''' Contains flags for the useragent, read from navigator.userAgent. While jQuery.browser will not be removed from future versions of jQuery, every effort to use jQuery.support and proper feature detection should be made.
				</p>
    <p>
					Available flags are:
* safari
* opera
* msie
* mozilla
				</p>
    <h2>Example:</h2>
    <p>
						Show the browser info.
					</p>
    <pre>
      <code class="javascript">jQuery.each(jQuery.browser, function(i, val) {
      $("&lt;div&gt;" + i + " : &lt;span&gt;" + val + "&lt;/span&gt;")
                .appendTo(document.body);
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;Browser info:&lt;/p&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Returns true if the current useragent is some version of Microsoft's Internet Explorer.
					</p>
    <pre>
      <code class="javascript">$.browser.msie
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Alerts "this is safari!" only for safari browsers
					</p>
    <pre>
      <code class="javascript">if ($.browser.safari) {
    alert("this is safari!");
 }
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Alerts "Do stuff for firefox 3" only for firefox 3 browsers.
					</p>
    <pre>
      <code class="javascript">jQuery.each(jQuery.browser, function(i, val) {
   if(i=="mozilla" &amp;&amp; jQuery.browser.version.substr(0,3)=="1.9")
      alert("Do stuff for firefox 3")
 });
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Set a CSS property to specific browser.
					</p>
    <pre>
      <code class="javascript">jQuery.each(jQuery.browser, function(i) {
   if($.browser.msie){
      $("#div ul li").css("display","inline");
   }else{
      $("#div ul li").css("display","inline-table");
   }
 });
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4671557" d:title="Utilities/jQuery.browser.version">
    <d:index d:value="jQuery.browser.version" d:title="Utilities/jQuery.browser.version"/>
    <p class="title">Utilities/jQuery.browser.version</p>
    <p>
					'''Deprecated in jQuery 1.3 (see jQuery.support)''' The version number of the rendering engine for the user's browser.
				</p>
    <p>
					Here are some typical results:
* Internet Explorer: 6.0, 7.0
* Mozilla/Firefox/Flock/Camino: 1.7.12, 1.8.1.3, 1.9
* Opera: 9.20
* Safari/Webkit: 312.8, 418.9<br xmlns=""/><br xmlns=""/>Note that IE8 claims to be 7 in Compatibility View.
				</p>
    <h2>Example:</h2>
    <p>
						Returns the browser version.
					</p>
    <pre>
      <code class="javascript">$("p").html("The browser version is: &lt;span&gt;" +
                jQuery.browser.version + "&lt;/span&gt;");

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;
  &lt;/p&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Alerts the version of IE that is being used
					</p>
    <pre>
      <code class="javascript">if ( $.browser.msie )
  alert( $.browser.version );
}
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Often you only care about the "major number," the whole number. This can be accomplished with JavaScript's built-in parseInt() function:
					</p>
    <pre>
      <code class="javascript">if (jQuery.browser.msie) {
  alert(parseInt(jQuery.browser.version));
}

					</code>
    </pre>
  </d:entry>
  <d:entry id="id4672938" d:title="Internals/jQuery.data(elem)">
    <d:index d:value="jQuery.data" d:title="Internals/jQuery.data(elem)"/>
    <p class="title">Internals/jQuery.data(elem)</p>
    <p>
					Returns a unique ID for the element.
				</p>
    <p>
					Typically this function will only be used internally. You will likely not use the data() method in this way.  It is called automatically when necessary when using the other data() functionality.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>elem (<span class="arg-type" title="The Javascript object representation of a DOM Element.">Element</span>)</span>
    						- 
						DOM element of interest.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Get the store id of an element.  It is assigned on the data() function call if one hasn't been assigned yet.
					</p>
    <pre>
      <code class="javascript">$(document.body).click(function(e) {
      var id = jQuery.data(e.target);
      $("span").text(id);
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div&gt;A div&lt;/div&gt;
  &lt;div&gt;Another&lt;/div&gt;
  &lt;p&gt;The id of this div is &lt;span&gt;?&lt;/span&gt;&lt;/p&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4673010" d:title="Internals/jQuery.data(elem, name)">
    <d:index d:value="jQuery.data" d:title="Internals/jQuery.data(elem, name)"/>
    <p class="title">Internals/jQuery.data(elem, name)</p>
    <p>
					Returns value at named data store for the element.
				</p>
    <p>
					
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>elem (<span class="arg-type" title="The Javascript object representation of a DOM Element.">Element</span>)</span>
    						- 
						DOM element of interest.
					</li>
        <li><span>name (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						Name of the data stored.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Get the data named "blah" stored at for an element.
					</p>
    <pre>
      <code class="javascript">$("button").click(function(e) {
      var adiv = $("div").get(0);
      var value;

      switch ($("button").index(this)) {
        case 0 :
          value = jQuery.data(adiv, "blah");
          break;
        case 1 :
          jQuery.data(adiv, "blah", "hello");
          value = "Stored!";
          break;
        case 2 :
          jQuery.data(adiv, "blah", 86);
          value = "Stored!";
          break;
        case 3 :
          jQuery.removeData(adiv);
          value = "Removed!";
          break;
      }

      $("span").text("" + value);
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div&gt;A div&lt;/div&gt;
  &lt;button&gt;Get "blah" from the div&lt;/button&gt;
  &lt;button&gt;Set "blah" to "hello"&lt;/button&gt;
  &lt;button&gt;Set "blah" to 86&lt;/button&gt;
  &lt;button&gt;Remove "blah" from the div&lt;/button&gt;
  &lt;p&gt;The "blah" value of this div is &lt;span&gt;?&lt;/span&gt;&lt;/p&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4673093" d:title="Internals/jQuery.data(elem, name, value)">
    <d:index d:value="jQuery.data" d:title="Internals/jQuery.data(elem, name, value)"/>
    <p class="title">Internals/jQuery.data(elem, name, value)</p>
    <p>
					Stores the value in the named spot and also returns the value.
				</p>
    <p>
					This function can be useful for attaching data to elements without having to create a new expando.  It also isn't limited to a string.  The value can be any format.<br xmlns=""/><br xmlns=""/>To avoid conflicts in plugins, it is usually effective to store one object using the plugin name and put all the necessary information in that object.<br xmlns=""/><br xmlns=""/>&lt;code&gt;
  var obj = jQuery.data($("#target").get(0), "pluginname", {});
  obj[...] = ...
&lt;/code&gt;
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>elem (<span class="arg-type" title="The Javascript object representation of a DOM Element.">Element</span>)</span>
    						- 
						DOM element of interest.
					</li>
        <li><span>name (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						Name of the data to store.
					</li>
        <li><span>value (<span class="arg-type" title="">Any</span>)</span>
    						- 
						Value to be stored.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Store then retrieve a value from the div element.
					</p>
    <pre>
      <code class="javascript">var adiv = $("div").get(0);
    jQuery.data(adiv, "test", { first: 16, last: "pizza!" });
    $("span:first").text(jQuery.data(adiv, "test").first);
    $("span:last").text(jQuery.data(adiv, "test").last);

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div&gt;
    The values stored were 
    &lt;span&gt;&lt;/span&gt;
    and
    &lt;span&gt;&lt;/span&gt;
  &lt;/div&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4671720" d:title="Utilities/jQuery.each(object, callback)">
    <d:index d:value="jQuery.each" d:title="Utilities/jQuery.each(object, callback)"/>
    <p class="title">Utilities/jQuery.each(object, callback)</p>
    <p>
					A generic iterator function, which can be used to seamlessly iterate over both objects and arrays. Arrays and array-like objects with a length property (such as a function's arguments object) are iterated by numeric index, from 0 to length-1. Other objects are iterated via their named properties.<br xmlns=""/><br xmlns=""/>				</p>
    <p>
					This function is not the same as 
&lt;a href='Core/each'&gt;$().each()&lt;/a&gt;					 - which is used to iterate, exclusively, over a jQuery object. This function can be used to iterate over anything.<br xmlns=""/><br xmlns=""/>The callback has two arguments:the key (objects) or index (arrays) as the first, and the value as the second.<br xmlns=""/><br xmlns=""/>If you wish to break the each() loop at a particular iteration you can do so by making your function return false. Returning non-false is the same as a &lt;code&gt;continue&lt;/code&gt; statement in a for loop, it will skip immediately to the next iteration.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>object (<span class="arg-type" title="A simple Javascript object..">Object</span>)</span>
    						- 
						The object or array to iterate over.
					</li>
        <li><span>callback (<span class="arg-type" title="A reference to a Javascript function.">Function</span>)</span>
    						- 
						The function that will be executed on every object.
&lt;pre&gt;function callback(indexInArray, valueOfElement) {
  var booleanKeepGoing;

  this; // == valueOfElement (casted to Object)

  return booleanKeepGoing; // optional, unless false 
                           // and want to stop looping
}
&lt;/pre&gt;
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Iterates through the array displaying each number as both a word and numeral
					</p>
    <pre>
      <code class="javascript">var arr = [ "one", "two", "three", "four", "five" ];
    var obj = { one:1, two:2, three:3, four:4, five:5 };

    jQuery.each(arr, function() {
      $("#" + this).text("My id is " + this + ".");
      return (this != "four"); // will stop running to skip "five"
    });

    jQuery.each(obj, function(i, val) {
      $("#" + i).append(document.createTextNode(" - " + val));
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div id="one"&gt;&lt;/div&gt;
  &lt;div id="two"&gt;&lt;/div&gt;
  &lt;div id="three"&gt;&lt;/div&gt;
  &lt;div id="four"&gt;&lt;/div&gt;
  &lt;div id="five"&gt;&lt;/div&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Iterates over items in an array, accessing both the current item and its index.
					</p>
    <pre>
      <code class="javascript">$.each( [0,1,2], function(i, n){
   alert( "Item #" + i + ": " + n );
 });
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Iterates over the properties in an object, accessing both the current item and its key.
					</p>
    <pre>
      <code class="javascript">$.each( { name: "John", lang: "JS" }, function(i, n){
   alert( "Name: " + i + ", Value: " + n );
 });
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4602469" d:title="Core/jQuery.extend(object)">
    <d:index d:value="jQuery.extend" d:title="Core/jQuery.extend(object)"/>
    <p class="title">Core/jQuery.extend(object)</p>
    <p>
					Extends the jQuery object itself.
				</p>
    <p>
					Can be used to add functions into the jQuery namespace. See 
&lt;a href='Core/jQuery.fn.extend'&gt;jQuery.fn.extend&lt;/a&gt;					 for more information on using this method to add 
&lt;a href='Plugins/Authoring'&gt;Plugins&lt;/a&gt;					.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>object (<span class="arg-type" title="A simple Javascript object..">Object</span>)</span>
    						- 
						The object that will be merged into the jQuery object.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Adds two functions into the jQuery namespace.
					</p>
    <pre>
      <code class="javascript">jQuery.extend({
  min: function(a, b) { return a &lt; b ? a : b; },
  max: function(a, b) { return a &gt; b ? a : b; }
});
					</code>
    </pre>
    <h3>Result:</h3>
    <pre>
      <code class="html">jQuery.min(2,3); // =&gt; 2
jQuery.max(4,5); // =&gt; 5
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4671842" d:title="Utilities/jQuery.extend(deep, target, object1, objectN)">
    <d:index d:value="jQuery.extend" d:title="Utilities/jQuery.extend(deep, target, object1, objectN)"/>
    <p class="title">Utilities/jQuery.extend(deep, target, object1, objectN)</p>
    <p>
					Extend one object with one or more others, returning the modified object.
				</p>
    <p>
					If no target is specified, the JQuery namespace itself is extended.  This can be useful for plugin authors wishing to add new methods to JQuery.<br xmlns=""/><br xmlns=""/>Keep in mind that the target object will be modified, and will be returned from extend().<br xmlns=""/><br xmlns=""/>If a boolean true is specified as the first argument, JQuery performs a deep copy, recursively copying any objects it finds.  Otherwise, the copy will share structure with the original object(s).<br xmlns=""/><br xmlns=""/>Undefined properties are not copied.  However, properties inherited from the object's prototype ''will'' be copied over.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>deep (<span class="arg-type" title="true or false.">Boolean</span>)</span>
    						- 
						If set, the merge becomes recursive (i.e. deep copy).
					</li>
        <li><span>target (<span class="arg-type" title="A simple Javascript object..">Object</span>)</span>
    						- 
						The object to extend.
					</li>
        <li><span>object1 (<span class="arg-type" title="A simple Javascript object..">Object</span>)</span>
    						- 
						The object that will be merged into the first.
					</li>
        <li><span>objectN (<span class="arg-type" title="A simple Javascript object..">Object</span>)</span>
    						- 
						More objects to merge into the first.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Merge settings and options, modifying settings.
					</p>
    <pre>
      <code class="javascript">var settings = { validate: false, limit: 5, name: "foo" };
var options = { validate: true, name: "bar" };
jQuery.extend(settings, options);
					</code>
    </pre>
    <h3>Result:</h3>
    <pre>
      <code class="html">settings == { validate: true, limit: 5, name: "bar" }
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Merge defaults and options, without modifying the defaults.
					</p>
    <pre>
      <code class="javascript">var empty = {};
var defaults = { validate: false, limit: 5, name: "foo" };
var options = { validate: true, name: "bar" };
var settings = $.extend(empty, defaults, options);
					</code>
    </pre>
    <h3>Result:</h3>
    <pre>
      <code class="html">settings == { validate: true, limit: 5, name: "bar" }
empty == { validate: true, limit: 5, name: "bar" }
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4602409" d:title="Core/jQuery.fn.extend(object)">
    <d:index d:value="jQuery.fn.extend" d:title="Core/jQuery.fn.extend(object)"/>
    <p class="title">Core/jQuery.fn.extend(object)</p>
    <p>
					Extends the jQuery element set to provide new methods (used to make a typical jQuery plugin).
				</p>
    <p>
					Can be used to add functions into the to add 
&lt;a href='Plugins/Authoring'&gt;plugin methods (plugins)&lt;/a&gt;					. 
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>object (<span class="arg-type" title="A simple Javascript object..">Object</span>)</span>
    						- 
						The object that will be merged into the jQuery object.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Adds two plugin methods.
					</p>
    <pre>
      <code class="javascript">jQuery.fn.extend({
  check: function() {
    return this.each(function() { this.checked = true; });
  },
  uncheck: function() {
    return this.each(function() { this.checked = false; });
  }
});
					</code>
    </pre>
    <h3>Result:</h3>
    <pre>
      <code class="html">$("input:checkbox").check();
$("input:radio").uncheck();
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4669365" d:title="Effects/jQuery.fx.off">
    <d:index d:value="jQuery.fx.off" d:title="Effects/jQuery.fx.off"/>
    <p class="title">Effects/jQuery.fx.off</p>
    <p>
					Globally disable all animations.
				</p>
    <p>
					&lt;p&gt;Setting this property to true will disable all animations from occurring (the effect will happen instantaneously, instead). This may be desirable for a couple reasons:&lt;/p&gt;
# You're using jQuery on a low-resource device.
# Some of your users are encountering [http://www.jdeegan.phlegethon.org/turn_off_animation.html accessibility problems] with the animations.
&lt;p&gt;Animations can be turned back on by setting the property to false.&lt;/p&gt;
				</p>
    <h2>Example:</h2>
    <p>
						Run a disabled animation
					</p>
    <pre>
      <code class="javascript">jQuery.fx.off = true;
    $("input").click(function(){
      $("div").toggle("slow");
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;input type="button" value="Run"/&gt;&lt;div&gt;&lt;/div&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4670129" d:title="Ajax/jQuery.get(url, data, callback, type)">
    <d:index d:value="jQuery.get" d:title="Ajax/jQuery.get(url, data, callback, type)"/>
    <p class="title">Ajax/jQuery.get(url, data, callback, type)</p>
    <p>
					Load a remote page using an HTTP GET request.
				</p>
    <p>
					This is an easy way to send a simple GET request to a server without having to use the more complex $.ajax function. It allows a single callback function to be specified that will be executed when the request is complete (and only if the response has a successful response code). If you need to have both error and success callbacks, you may want to use $.ajax.<br xmlns=""/><br xmlns=""/>
$.get() returns the XMLHttpRequest that it creates. In most cases you won't need that object to manipulate directly, but it is available if you need to abort the request manually.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>url (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						The URL of the page to load.
					</li>
        <li><span>data (<span class="arg-type" title="A Javascript object that contains key/value pairs in the form of properties and values.">Map</span>)</span>
    						- 
						Key/value pairs that will be sent to the server.
					</li>
        <li><span>callback (<span class="arg-type" title="A reference to a Javascript function.">Function</span>)</span>
    						- 
						A function to be executed whenever the data is loaded successfully.
&lt;pre&gt;function (data, textStatus) {
  // data could be xmlDoc, jsonObj, html, text, etc...
  this; // the options for this ajax request
}
&lt;/pre&gt;
					</li>
        <li><span>type (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						Type of data to be returned to callback function:  "xml", "html", "script", "json", "jsonp", or "text".
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Request the test.php page, but ignore the return results.
					</p>
    <pre>
      <code class="javascript">$.get("test.php");
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Request the test.php page and send some additional data along (while still ignoring the return results).
					</p>
    <pre>
      <code class="javascript">$.get("test.php", { name: "John", time: "2pm" } );
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						pass arrays of data to the server (while still ignoring the return results).
					</p>
    <pre>
      <code class="javascript">$.get("test.php", { 'choices[]': ["Jon", "Susan"]} );
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Alert out the results from requesting test.php (HTML or XML, depending on what was returned).
					</p>
    <pre>
      <code class="javascript">$.get("test.php", function(data){
   alert("Data Loaded: " + data);
 });
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Alert out the results from requesting test.cgi with an additional payload of data (HTML or XML, depending on what was returned).
					</p>
    <pre>
      <code class="javascript">$.get("test.cgi", { name: "John", time: "2pm" },
   function(data){
     alert("Data Loaded: " + data);
   });
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4670293" d:title="Ajax/jQuery.getJSON(url, data, callback)">
    <d:index d:value="jQuery.getJSON" d:title="Ajax/jQuery.getJSON(url, data, callback)"/>
    <p class="title">Ajax/jQuery.getJSON(url, data, callback)</p>
    <p>
					Load JSON data using an HTTP GET request.
				</p>
    <p>
					As of jQuery 1.2, you can load JSON data located on another domain if you specify a [http://bob.pythonmac.org/archives/2005/12/05/remote-json-jsonp/ JSONP] callback.<br xmlns=""/><br xmlns=""/>The callback takes the form "example.com?callback=?". jQuery automatically replaces the '?' with a random method name that doesn't clash with the global scope. You '''do not''' have to specify the method name yourself.<br xmlns=""/><br xmlns=""/>Note that the site you're trying to call needs to support JSON-P output. The callback parameter might vary depending on the API, for instance Yahoo Pipes requires "_callback=?"<br xmlns=""/><br xmlns=""/>Keep in mind, that lines after this function will be executed before the callback.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>url (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						The URL of the page to load.
					</li>
        <li><span>data (<span class="arg-type" title="A Javascript object that contains key/value pairs in the form of properties and values.">Map</span>)</span>
    						- 
						Key/value pairs that will be sent to the server.
					</li>
        <li><span>callback (<span class="arg-type" title="A reference to a Javascript function.">Function</span>)</span>
    						- 
						A function to be executed whenever the data is loaded successfully.
&lt;pre&gt;function (data, textStatus) {
  // data will be a jsonObj
  // textStatus will be "success"
  this; // the options for this ajax request
}
&lt;/pre&gt;
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Loads the four most recent cat pictures from the Flickr JSONP API.
					</p>
    <pre>
      <code class="javascript">$.getJSON("http://api.flickr.com/services/feeds/photos_public.gne?tags=cat&amp;tagmode=any&amp;format=json&amp;jsoncallback=?",
        function(data){
          $.each(data.items, function(i,item){
            $("&lt;img/&gt;").attr("src", item.media.m).appendTo("#images");
            if ( i == 3 ) return false;
          });
        });
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div id="images"&gt;
  &lt;/div&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Load the JSON data from test.js and access a name from the returned JSON data.
					</p>
    <pre>
      <code class="javascript">$.getJSON("test.js", function(json){
   alert("JSON Data: " + json.users[3].name);
 });
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Load the JSON data from test.js, passing along additional data, and access a name from the returned JSON data.
					</p>
    <pre>
      <code class="javascript">$.getJSON("test.js", { name: "John", time: "2pm" }, function(json){
   alert("JSON Data: " + json.users[3].name);
 });
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						List the result of a consultation of pages.php in HTML as an array. By Manuel Gonzalez.
					</p>
    <pre>
      <code class="javascript">var id=$("#id").attr("value");
  $.getJSON("pages.php",{id:id},dates);
function dates(datos)
{
	
 $("#list").html("Name:"+datos[1].name+"&lt;br&gt;"+"Last Name:"+datos[1].lastname+"&lt;br&gt;"+"Address:"+datos[1].address);
}

					</code>
    </pre>
  </d:entry>
  <d:entry id="id4670435" d:title="Ajax/jQuery.getScript(url, callback)">
    <d:index d:value="jQuery.getScript" d:title="Ajax/jQuery.getScript(url, callback)"/>
    <p class="title">Ajax/jQuery.getScript(url, callback)</p>
    <p>
					Loads and executes a JavaScript file using an HTTP GET request.
				</p>
    <p>
					Before jQuery 1.2, getScript was only able to load scripts from the same domain as the original page. As of 1.2, you can now load JavaScript files from any domain.<br xmlns=""/><br xmlns=""/>'''Warning''': In Safari version 2 and older it's not possible to evaluate scripts in a global context synchronously. If you load functions via getScript, make sure to call them ''after'' a delay.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>url (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						The URL of the page to load.
					</li>
        <li><span>callback (<span class="arg-type" title="A reference to a Javascript function.">Function</span>)</span>
    						- 
						A function to be executed whenever the data is loaded successfully.
&lt;pre&gt;function (data, textStatus) {
  // data should be javascript
  this; // the options for this ajax request
}
&lt;/pre&gt;
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						We load the new [http://jquery.com/plugins/project/color official jQuery Color Animation plugin] dynamically and bind some color animations to occur once the new functionality is loaded.
					</p>
    <pre>
      <code class="javascript">$.getScript("http://dev.jquery.com/view/trunk/plugins/color/jquery.color.js", function(){
  $("#go").click(function(){
    $(".block").animate( { backgroundColor: 'pink' }, 1000)
      .animate( { backgroundColor: 'blue' }, 1000);
  });
});
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;button id="go"&gt;&amp;raquo; Run&lt;/button&gt;
&lt;div class="block"&gt;&lt;/div&gt;

					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Load the test.js JavaScript file and execute it.
					</p>
    <pre>
      <code class="javascript">$.getScript("test.js");
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Load the test.js JavaScript file and execute it, displaying an alert message when the execution is complete.
					</p>
    <pre>
      <code class="javascript">$.getScript("test.js", function(){
   alert("Script loaded and executed.");
 });
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4671970" d:title="Utilities/jQuery.grep(array, callback, invert)">
    <d:index d:value="jQuery.grep" d:title="Utilities/jQuery.grep(array, callback, invert)"/>
    <p class="title">Utilities/jQuery.grep(array, callback, invert)</p>
    <p>
					Finds the elements of an array which satisfy a filter function. The original array is not affected.
				</p>
    <p>
					The filter function will be passed two arguments: the current array item and its index. The filter function must return 'true' to include the item in the result array.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>array (<span class="arg-type" title="">Array</span>)</span>
    						- 
						The Array to find items in.
					</li>
        <li><span>callback (<span class="arg-type" title="A reference to a Javascript function.">Function</span>)</span>
    						- 
						The function to process each item against.  The first argument to the function is the list item, and the second argument is the list index.  The function should return a Boolean value.  The "lambda-form" function feature was removed in jQuery 1.2.3 to help compatibility with other frameworks.
&lt;pre&gt;function callback(elementOfArray, indexInArray) {
  var shouldKeepIt;

  this; // == window

  return shouldKeepIt;
}
&lt;/pre&gt;
					</li>
        <li><span>invert (<span class="arg-type" title="true or false.">Boolean</span>)</span>
    						- 
						If "invert" is false, or not provided, then the function returns an array consisting of all elements for which "callback" returns true.  If "invert" is true, then the function returns an array consisting of all elements for which "callback" returns false.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Filters the original array of numbers leaving that are not 5 and have an index greater than 4.  Then it removes all 9s.
					</p>
    <pre>
      <code class="javascript">var arr = [ 1, 9, 3, 8, 6, 1, 5, 9, 4, 7, 3, 8, 6, 9, 1 ];
    $("div").text(arr.join(", "));

    arr = jQuery.grep(arr, function(n, i){
      return (n != 5 &amp;&amp; i &gt; 4);
    });
    $("p").text(arr.join(", "));

    arr = jQuery.grep(arr, function (a) { return a != 9; });
    $("span").text(arr.join(", "));

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div&gt;&lt;/div&gt;
  &lt;p&gt;&lt;/p&gt;
  &lt;span&gt;&lt;/span&gt;
  
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Filter an array of numbers to include only numbers bigger then zero.
					</p>
    <pre>
      <code class="javascript">$.grep( [0,1,2], function(n,i){
   return n &gt; 0;
 });
					</code>
    </pre>
    <h3>Result:</h3>
    <pre>
      <code class="html">[1, 2]
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4672328" d:title="Utilities/jQuery.inArray(value, array)">
    <d:index d:value="jQuery.inArray" d:title="Utilities/jQuery.inArray(value, array)"/>
    <p class="title">Utilities/jQuery.inArray(value, array)</p>
    <p>
					Determine the index of the first parameter in the Array (-1 if not found).
				</p>
    <p>
					
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>value (<span class="arg-type" title="">Any</span>)</span>
    						- 
						Value to see if it exists in the array.
					</li>
        <li><span>array (<span class="arg-type" title="">Array</span>)</span>
    						- 
						Array to look through for the value.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						
					</p>
    <pre>
      <code class="javascript">var arr = [ 4, "Pete", 8, "John" ];

    $("span:eq(0)").text(jQuery.inArray("John", arr));
    $("span:eq(1)").text(jQuery.inArray(4, arr));
    $("span:eq(2)").text(jQuery.inArray("David", arr));

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div&gt;"John" found at &lt;span&gt;&lt;/span&gt;&lt;/div&gt;
  &lt;div&gt;4 found at &lt;span&gt;&lt;/span&gt;&lt;/div&gt;
  &lt;div&gt;"David" found at &lt;span&gt;&lt;/span&gt;&lt;/div&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4672601" d:title="Utilities/jQuery.isArray(obj)">
    <d:index d:value="jQuery.isArray" d:title="Utilities/jQuery.isArray(obj)"/>
    <p class="title">Utilities/jQuery.isArray(obj)</p>
    <p>
					'''Added in jQuery 1.3''' Determine if the parameter passed is an array.
				</p>
    <p>
					
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>obj (<span class="arg-type" title="A simple Javascript object..">Object</span>)</span>
    						- 
						Object to test whether or not it is an array.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Finds out if the parameter is an array.
					</p>
    <pre>
      <code class="javascript">$("b").append( "" + $.isArray([]) );
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  Is [] an Array? &lt;b&gt;&lt;/b&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4672660" d:title="Utilities/jQuery.isFunction(obj)">
    <d:index d:value="jQuery.isFunction" d:title="Utilities/jQuery.isFunction(obj)"/>
    <p class="title">Utilities/jQuery.isFunction(obj)</p>
    <p>
					Determine if the parameter passed is a Javascript function object. 
				</p>
    <p>
					&lt;p&gt;'''Note:''' As of jQuery 1.3, functions provided by the browser like 'alert', and DOM element methods like 'getAttribute', are not guaranteed to be detected as functions in browsers such as Internet Explorer.&lt;/p&gt;
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>obj (<span class="arg-type" title="A simple Javascript object..">Object</span>)</span>
    						- 
						Object to test whether or not it is a function.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Test a few parameter examples.
					</p>
    <pre>
      <code class="javascript">function stub() {
    }
    var objs = [
          function () {},
          { x:15, y:20 },
          null,
          stub,
          "function"
        ];

    jQuery.each(objs, function (i) {
      var isFunc = jQuery.isFunction(objs[i]);
      $("span").eq(i).text(isFunc);
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div&gt;jQuery.isFunction(objs[0]) = &lt;span&gt;&lt;/span&gt;&lt;/div&gt;
  &lt;div&gt;jQuery.isFunction(objs[1]) = &lt;span&gt;&lt;/span&gt;&lt;/div&gt;
  &lt;div&gt;jQuery.isFunction(objs[2]) = &lt;span&gt;&lt;/span&gt;&lt;/div&gt;
  &lt;div&gt;jQuery.isFunction(objs[3]) = &lt;span&gt;&lt;/span&gt;&lt;/div&gt;
  &lt;div&gt;jQuery.isFunction(objs[4]) = &lt;span&gt;&lt;/span&gt;&lt;/div&gt;
  
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Finds out if the parameter is a funcion.
					</p>
    <pre>
      <code class="javascript">$.isFunction(function(){});
					</code>
    </pre>
    <h3>Result:</h3>
    <pre>
      <code class="html">true
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4672095" d:title="Utilities/jQuery.makeArray(obj)">
    <d:index d:value="jQuery.makeArray" d:title="Utilities/jQuery.makeArray(obj)"/>
    <p class="title">Utilities/jQuery.makeArray(obj)</p>
    <p>
					Turns anything into a true array.
				</p>
    <p>
					Typically it will be unnecessary to use this function if you are using jQuery which uses this function internally.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>obj (<span class="arg-type" title="A simple Javascript object..">Object</span>)</span>
    						- 
						Anything to turn into an actual Array.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Turn a collection of HTMLElements into an Array of them.
					</p>
    <pre>
      <code class="javascript">var arr = jQuery.makeArray(document.getElementsByTagName("div"));
    arr.reverse(); // use an Array method on list of dom elements
    $(arr).appendTo(document.body);

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div&gt;First&lt;/div&gt;
  &lt;div&gt;Second&lt;/div&gt;  
  &lt;div&gt;Third&lt;/div&gt;
  &lt;div&gt;Fourth&lt;/div&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4672166" d:title="Utilities/jQuery.map(array, callback)">
    <d:index d:value="jQuery.map" d:title="Utilities/jQuery.map(array, callback)"/>
    <p class="title">Utilities/jQuery.map(array, callback)</p>
    <p>
					Translate all items in an array to another array of items.
				</p>
    <p>
					The translation function that is provided to this method is called for each item in the array and is passed two arguments: The the item to be translated, and index within the array.<br xmlns=""/><br xmlns=""/>The function can then return the translated value, 'null' (to remove the item), or an array of values - which will be flattened into the full array. <br xmlns=""/><br xmlns=""/>Map can also iterate through Array-like objects that have a length property.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>array (<span class="arg-type" title="">Array</span>)</span>
    						- 
						The Array to translate.
					</li>
        <li><span>callback (<span class="arg-type" title="A reference to a Javascript function.">Function</span>)</span>
    						- 
						The function to process each item against.  The argument to the function is the list item. The function can return any value.  The "lambda-form" function represented as a string no longer works.  It was removed in version 1.2.3 to increase compatibility with Adobe AIR.   
&lt;pre&gt;function callback(elementOfArray, indexInArray) {
  var replacementValue;

  this; // unmapped

  return replacementValue;
}
&lt;/pre&gt;
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						A couple examples of using .map()
					</p>
    <pre>
      <code class="javascript">var arr = [ "a", "b", "c", "d", "e" ]
    $("div").text(arr.join(", "));

    arr = jQuery.map(arr, function(n, i){
      return (n.toUpperCase() + i);
    });
    $("p").text(arr.join(", "));

    arr = jQuery.map(arr, function (a) { return a + a; });
    $("span").text(arr.join(", "));

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div&gt;&lt;/div&gt;
  &lt;p&gt;&lt;/p&gt;
  &lt;span&gt;&lt;/span&gt;
  
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Maps the original array to a new one and adds 4 to each value.
					</p>
    <pre>
      <code class="javascript">$.map( [0,1,2], function(n){
   return n + 4;
 });
					</code>
    </pre>
    <h3>Result:</h3>
    <pre>
      <code class="html">[4, 5, 6]
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Maps the original array to a new one and adds 1 to each value if it is bigger then zero, otherwise it's removed.
					</p>
    <pre>
      <code class="javascript">$.map( [0,1,2], function(n){
   return n &gt; 0 ? n + 1 : null;
 });
					</code>
    </pre>
    <h3>Result:</h3>
    <pre>
      <code class="html">[2, 3]
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Maps the original array to a new one, each element is added with it's original value and the value plus one.
					</p>
    <pre>
      <code class="javascript">$.map( [0,1,2], function(n){
   return [ n, n + 1 ];
 });
					</code>
    </pre>
    <h3>Result:</h3>
    <pre>
      <code class="html">[0, 1, 1, 2, 2, 3]
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Maps the original array to a new one, each element is squared.
					</p>
    <pre>
      <code class="javascript">$.map( [0,1,2,3], function (a) { return a * a; } );
					</code>
    </pre>
    <h3>Result:</h3>
    <pre>
      <code class="html">[0, 1, 4, 9]
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4672410" d:title="Utilities/jQuery.merge(first, second)">
    <d:index d:value="jQuery.merge" d:title="Utilities/jQuery.merge(first, second)"/>
    <p class="title">Utilities/jQuery.merge(first, second)</p>
    <p>
					Merge two arrays together. 
				</p>
    <p>
					The result is the altered first argument with the elements from the second array added. The arguments should be true Javascript Array objects; use jQuery.makeArray if they are not. To remove duplicate elements from the resulting array, use $.unique().
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>first (<span class="arg-type" title="">Array</span>)</span>
    						- 
						The first array to merge, the elements of second added.
					</li>
        <li><span>second (<span class="arg-type" title="">Array</span>)</span>
    						- 
						The second array to merge into the first, unaltered.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Merges two arrays, altering the first argument.
					</p>
    <pre>
      <code class="javascript">$.merge( [0,1,2], [2,3,4] )
					</code>
    </pre>
    <h3>Result:</h3>
    <pre>
      <code class="html">[0,1,2,2,3,4]
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Merges two arrays, altering the first argument.
					</p>
    <pre>
      <code class="javascript">$.merge( [3,2,1], [4,3,2] )
					</code>
    </pre>
    <h3>Result:</h3>
    <pre>
      <code class="html">[3,2,1,4,3,2]
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4602536" d:title="Core/jQuery.noConflict()">
    <d:index d:value="jQuery.noConflict" d:title="Core/jQuery.noConflict()"/>
    <p class="title">Core/jQuery.noConflict()</p>
    <p>
					Run this function to give control of the $ variable back to whichever library first implemented it.
				</p>
    <p>
					This helps to make sure that jQuery doesn't conflict with the $ object of other libraries.<br xmlns=""/><br xmlns=""/>By using this function, you will only be able to access jQuery using the 'jQuery' variable. For example, where you used to do $("div p"), you now must do jQuery("div p").<br xmlns=""/><br xmlns=""/>'''NOTE:''' This function must be called after including the jQuery javascript file, but '''before''' including any other conflicting library, and also before actually that other conflicting library gets used, in case jQuery is included last.  noConflict can be called at the end of the jQuery.js file to globally disable the $() jQuery alias.  jQuery.noConflict returns a reference to jQuery, so it can be used to override the $() alias of the jQuery object.<br xmlns=""/><br xmlns=""/>There is more detail and tips available at 
&lt;a href='Using_jQuery_with_Other_Libraries'&gt;Using jQuery with Other Libraries&lt;/a&gt;					.
				</p>
    <h2>Example:</h2>
    <p>
						Maps the original object that was referenced by $ back to $.
					</p>
    <pre>
      <code class="javascript">jQuery.noConflict();
// Do something with jQuery
jQuery("div p").hide();
// Do something with another library's $()
$("content").style.display = 'none';
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Reverts the $ alias and then creates and executes a function to provide the $ as a jQuery alias inside the functions scope. Inside the function the original $ object is not available. This works well for most plugins that don't rely on any other library.  

					</p>
    <pre>
      <code class="javascript">jQuery.noConflict();
(function($) { 
  $(function() {
    // more code using $ as alias to jQuery
  });
})(jQuery);
// other code using $ as an alias to the other library
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						You can chain the jQuery.noConflict() with the shorthand ready for a compact code.

					</p>
    <pre>
      <code class="javascript">jQuery.noConflict()(function(){
    // code using jQuery
}); 
// other code using $ as an alias to the other library
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Creates a different alias instead of jQuery to use in the rest of the script.
					</p>
    <pre>
      <code class="javascript">var j = jQuery.noConflict();
// Do something with jQuery
j("div p").hide();
// Do something with another library's $()
$("content").style.display = 'none';
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4602621" d:title="Core/jQuery.noConflict(extreme)">
    <d:index d:value="jQuery.noConflict" d:title="Core/jQuery.noConflict(extreme)"/>
    <p class="title">Core/jQuery.noConflict(extreme)</p>
    <p>
					Revert control of both the $ and jQuery variables to their original owners. '''Use with discretion.'''
				</p>
    <p>
					This is a more-extreme version of the simple 
&lt;a href='Core/jQuery.noConflict'&gt;noConflict&lt;/a&gt;					 method, as this one will completely undo what jQuery has introduced. This is to be used in an extreme case where you'd like to embed jQuery into a high-conflict environment. '''NOTE:''' It's very likely that plugins won't work after this particular method has been called.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>extreme (<span class="arg-type" title="true or false.">Boolean</span>)</span>
    						- 
						Set to true to enable the extreme rollback of jQuery and its variables.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Completely move jQuery to a new namespace in another object.
					</p>
    <pre>
      <code class="javascript">var dom = {};
dom.query = jQuery.noConflict(true);
					</code>
    </pre>
    <h3>Result:</h3>
    <pre>
      <code class="html">// Do something with the new jQuery
dom.query("div p").hide();
// Do something with another library's $()
$("content").style.display = 'none';
// Do something with another version of jQuery
jQuery("div &gt; p").hide();
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4672855" d:title="Utilities/jQuery.param(obj)">
    <d:index d:value="jQuery.param" d:title="Utilities/jQuery.param(obj)"/>
    <p class="title">Utilities/jQuery.param(obj)</p>
    <p>
					Serializes an array of form elements or an object (core of 
&lt;a href='Ajax/serialize'&gt;.serialize()&lt;/a&gt;					 method).
				</p>
    <p>
					
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>obj (<span class="arg-type" title="">Array&lt;Elements&gt;, jQuery, Object</span>)</span>
    						- 
						An Array or jQuery object is serialized by name/value pairs.  An object by key/value pairs (As of jQuery 1.3, the return value of functions will be used instead of the function as a String).
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Serialize a key/value object.
					</p>
    <pre>
      <code class="javascript">var params = { width:1680, height:1050 };
    var str = jQuery.param(params);
    $("#results").text(str);

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div id="results"&gt;&lt;/div&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4670554" d:title="Ajax/jQuery.post(url, data, callback, type)">
    <d:index d:value="jQuery.post" d:title="Ajax/jQuery.post(url, data, callback, type)"/>
    <p class="title">Ajax/jQuery.post(url, data, callback, type)</p>
    <p>
					Load a remote page using an HTTP POST request.
				</p>
    <p>
					This is an easy way to send a simple POST request to a server without having to use the more complex $.ajax function. It allows a single callback function to be specified that will be executed when the request is complete (and only if the response has a successful response code).
The returned data format can be specified by the fourth parameter.
If you need to have both error and success callbacks, you may want to use $.ajax. $.post is a (simplified) wrapper function for $.ajax.
$.post() returns the XMLHttpRequest that it creates. In most cases you won't need that object to manipulate directly, but it is available if you need to abort the request manually.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>url (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						The URL of the page to load.
					</li>
        <li><span>data (<span class="arg-type" title="">Map, String</span>)</span>
    						- 
						Key/value pairs or the return value of the .serialize() function that will be sent to the server.
					</li>
        <li><span>callback (<span class="arg-type" title="A reference to a Javascript function.">Function</span>)</span>
    						- 
						A function to be executed whenever the data is loaded successfully.
&lt;pre&gt;function (data, textStatus) {
  // data could be xmlDoc, jsonObj, html, text, etc...
  this; // the options for this ajax request
  // textStatus can be one of:
  //   "timeout"
  //   "error"
  //   "notmodified"
  //   "success"
  //   "parsererror" 
  // NOTE: Apparently, only "success" is returned when you make
  // an Ajax call in this way. Other errors silently fail.
  // See above note about using $.ajax.
}
&lt;/pre&gt;
					</li>
        <li><span>type (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						Type of data to be returned to callback function:  "xml", "html", "script", "json", "jsonp", or "text".
&lt;pre&gt;$.postJSON = function(url, data, callback) {
	$.post(url, data, callback, "json");
};
&lt;/pre&gt;
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Request the test.php page, but ignore the return results.
					</p>
    <pre>
      <code class="javascript">$.post("test.php");
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Request the test.php page and send some additional data along (while still ignoring the return results).
					</p>
    <pre>
      <code class="javascript">$.post("test.php", { name: "John", time: "2pm" } );
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						pass arrays of data to the server (while still ignoring the return results).
					</p>
    <pre>
      <code class="javascript">$.post("test.php", { 'choices[]': ["Jon", "Susan"] });
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						send form data using ajax requests
					</p>
    <pre>
      <code class="javascript">$.post("test.php", $("#testform").serialize());
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Alert out the results from requesting test.php (HTML or XML, depending on what was returned).
					</p>
    <pre>
      <code class="javascript">$.post("test.php", function(data){
   alert("Data Loaded: " + data);
 });
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Alert out the results from requesting test.php with an additional payload of data (HTML or XML, depending on what was returned).
					</p>
    <pre>
      <code class="javascript">$.post("test.php", { name: "John", time: "2pm" },
   function(data){
     alert("Data Loaded: " + data);
   });
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Gets the test.php page content, store it in a XMLHttpResponse object and applies the process() JavaScript function.
					</p>
    <pre>
      <code class="javascript">$.post("test.php", { name: "John", time: "2pm" },
   function(data){
     process(data);
   }, "xml");
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Gets the test.php page contents which has been returned in json format (&lt;?php echo json_encode(array("name"=&gt;"John","time"=&gt;"2pm")); ?&gt;)

					</p>
    <pre>
      <code class="javascript">$.post("test.php", { func: "getNameAndTime" },
   function(data){
     alert(data.name); // John
     console.log(data.time); //  2pm
   }, "json");
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4673184" d:title="Internals/jQuery.removeData(elem)">
    <d:index d:value="jQuery.removeData" d:title="Internals/jQuery.removeData(elem)"/>
    <p class="title">Internals/jQuery.removeData(elem)</p>
    <p>
					Remove the expando attribute that allows data storage on an element.
				</p>
    <p>
					This is the complement function to jQuery.data(elem) which is called as necessary by jQuery.data(elem, name, value).
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>elem (<span class="arg-type" title="The Javascript object representation of a DOM Element.">Element</span>)</span>
    						- 
						Element to delete the data store from.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Set a data store then remove it.
					</p>
    <pre>
      <code class="javascript">var adiv = $("div").get(0);

    $("span:eq(0)").text("" + jQuery.data(adiv, "test1"));
    jQuery.data(adiv, "test1", "VALUE-1");
    jQuery.data(adiv, "test2", "VALUE-2");
    $("span:eq(1)").text("" + jQuery.data(adiv, "test1"));
    jQuery.removeData(adiv);
    $("span:eq(2)").text("" + jQuery.data(adiv, "test1"));
    $("span:eq(3)").text("" + jQuery.data(adiv, "test2"));

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div&gt;value1 before creation: &lt;span&gt;&lt;/span&gt;&lt;/div&gt;
  &lt;div&gt;value1 after creation: &lt;span&gt;&lt;/span&gt;&lt;/div&gt;
  &lt;div&gt;value1 after removal: &lt;span&gt;&lt;/span&gt;&lt;/div&gt;
  &lt;div&gt;value2 after removal: &lt;span&gt;&lt;/span&gt;&lt;/div&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4673259" d:title="Internals/jQuery.removeData(elem, name)">
    <d:index d:value="jQuery.removeData" d:title="Internals/jQuery.removeData(elem, name)"/>
    <p class="title">Internals/jQuery.removeData(elem, name)</p>
    <p>
					Removes just this one named data store.
				</p>
    <p>
					This is the complement function to jQuery.data(elem, name, value).
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>elem (<span class="arg-type" title="The Javascript object representation of a DOM Element.">Element</span>)</span>
    						- 
						Element to delete the named data store property from.
					</li>
        <li><span>name (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						The name of the data store property to remove.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Set a data store for 2 names then remove one of them.
					</p>
    <pre>
      <code class="javascript">var adiv = $("div").get(0);

    $("span:eq(0)").text("" + jQuery.data(adiv, "test1"));
    jQuery.data(adiv, "test1", "VALUE-1");
    jQuery.data(adiv, "test2", "VALUE-2");
    $("span:eq(1)").text("" + jQuery.data(adiv, "test1"));
    jQuery.removeData(adiv, "test1");
    $("span:eq(2)").text("" + jQuery.data(adiv, "test1"));
    $("span:eq(3)").text("" + jQuery.data(adiv, "test2"));

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div&gt;value1 before creation: &lt;span&gt;&lt;/span&gt;&lt;/div&gt;
  &lt;div&gt;value1 after creation: &lt;span&gt;&lt;/span&gt;&lt;/div&gt;
  &lt;div&gt;value1 after removal: &lt;span&gt;&lt;/span&gt;&lt;/div&gt;
  &lt;div&gt;value2 after removal: &lt;span&gt;&lt;/span&gt;&lt;/div&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4671359" d:title="Utilities/jQuery.support">
    <d:index d:value="jQuery.support" d:title="Utilities/jQuery.support"/>
    <p class="title">Utilities/jQuery.support</p>
    <p>
					'''Added in jQuery 1.3''' A collection of properties that represent the presence of different browser features or bugs.
				</p>
    <p>
					&lt;p&gt;jQuery comes with a number of properties included, you should feel free to add your own. Many of these properties are rather low-level so it's doubtful that they'll be useful in general day-to-day development, but mostly used by plugin and core developers.&lt;/p&gt;
&lt;p&gt;The values of all the support properties are determined using feature detection (and do not use any form of browser sniffing). There are some excellent resources that explain how feature detection works:&lt;/p&gt;
* http://peter.michaux.ca/articles/feature-detection-state-of-the-art-browser-scripting
* http://yura.thinkweb2.com/cft/
* http://www.jibbering.com/faq/faq_notes/not_browser_detect.html
&lt;p&gt;The tests included in jQuery.support are as follows:&lt;/p&gt;
* '''boxModel''': Is equal to true if the page and browser are rendering according to the [http://www.w3.org/TR/REC-CSS2/box.html W3C CSS Box Model] (is currently false in IE 6 and 7 when they are in Quirks Mode). This property is null until document ready occurs.
* '''cssFloat''': Is equal to true if style.cssFloat is used to access the current CSS float value (is currently false in IE, it uses styleFloat instead).
* '''hrefNormalized''': Is equal to true if the browser leaves intact the results from getAttribute("href")(is currently false in IE, the URLs are normalized).
* '''htmlSerialize''': Is equal to true if the browser properly serializes link elements when innerHTML is used (is currently false in IE).
* '''leadingWhitespace''': Is equal to true if the browser preserves leading whitespace when innerHTML is used (is currently false in IE 6-8).
* '''noCloneEvent''': Is equal to true if the browser does not clone event handlers when elements are cloned (is currently false in IE).
* '''objectAll''': Is equal to true if doing getElementsByTagName("*") on an object element returns all descendant elements (is currently false in IE 7 and IE 8).
* '''opacity''': Is equal to true if a browser can properly interpret the opacity style property (is currently false in IE, it uses alpha filters instead).
* '''scriptEval''': Is equal to true if using appendChild/createTextNode to inject inline scripts executes them (is currently false in IE, it uses .text to insert executable scripts).
* '''style''': Is equal to true if getAttribute("style") is able to return the inline style specified by an element (is currently false in IE - it uses cssText instead).
* '''tbody''': Is equal to true if the browser allows table elements without tbody elements (is currently false in IE, which automatically inserts tbody if it is not present in a string assigned to innerHTML).
				</p>
    <h2>Example:</h2>
    <p>
						Returns the box model for the iframe.
					</p>
    <pre>
      <code class="javascript">$("p").html("This frame uses the W3C box model: &lt;span&gt;" +
                jQuery.support.boxModel + "&lt;/span&gt;");

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;
  &lt;/p&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Returns false if the page is in QuirksMode in Internet Explorer
					</p>
    <pre>
      <code class="javascript">jQuery.support.boxModel
					</code>
    </pre>
    <h3>Result:</h3>
    <pre>
      <code class="html">false
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4672770" d:title="Utilities/jQuery.trim(str)">
    <d:index d:value="jQuery.trim" d:title="Utilities/jQuery.trim(str)"/>
    <p class="title">Utilities/jQuery.trim(str)</p>
    <p>
					Remove the whitespace from the beginning and end of a string.
				</p>
    <p>
					Uses a regular expression to remove whitespace from the given string.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>str (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						The string to trim.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Removes the two whitespaces at the start and at the end of the string.
					</p>
    <pre>
      <code class="javascript">$("button").click(function () {
      var str = "     lots of spaces before and after     ";
      alert("'" + str + "'");

      str = jQuery.trim(str);
      alert("'" + str + "' - no longer");
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;button&gt;Show Trim Example&lt;/button&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Removes the two whitespaces at the start and at the end of the string.
					</p>
    <pre>
      <code class="javascript">$.trim("  hello, how are you?  ");
					</code>
    </pre>
    <h3>Result:</h3>
    <pre>
      <code class="html">"hello, how are you?"
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4672502" d:title="Utilities/jQuery.unique(array)">
    <d:index d:value="jQuery.unique" d:title="Utilities/jQuery.unique(array)"/>
    <p class="title">Utilities/jQuery.unique(array)</p>
    <p>
					Remove all duplicate elements from an array of elements. Note that this only works on arrays of DOM elements, not strings or numbers.
				</p>
    <p>
					
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>array (<span class="arg-type" title="">Array</span>)</span>
    						- 
						The Array of Elements to translate.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Removes any duplicate elements from the array of divs.
					</p>
    <pre>
      <code class="javascript">var divs = $("div").get();

    // add 3 elements of class dup too (they are divs)
    divs = divs.concat($(".dup").get());
    $("div:eq(1)").text("Pre-unique there are " + divs.length + " elements.");

    divs = jQuery.unique(divs);
    $("div:eq(2)").text("Post-unique there are " + divs.length + " elements.")
                  .css("color", "red");

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div&gt;There are 6 divs in this document.&lt;/div&gt;
  &lt;div&gt;&lt;/div&gt;
  &lt;div class="dup"&gt;&lt;/div&gt;
  &lt;div class="dup"&gt;&lt;/div&gt;
  &lt;div class="dup"&gt;&lt;/div&gt;
  &lt;div&gt;&lt;/div&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Removes any duplicate elements from the array of divs.
					</p>
    <pre>
      <code class="javascript">$.unique(document.getElementsByTagName("div"));
					</code>
    </pre>
    <h3>Result:</h3>
    <pre>
      <code class="html">[&lt;div&gt;, &lt;div&gt;, ...]
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4666468" d:title="Events/keydown()">
    <d:index d:value="keydown" d:title="Events/keydown()"/>
    <p class="title">Events/keydown()</p>
    <p>
					Triggers the keydown event of each matched element.
				</p>
    <p>
					This causes all of the functions that have been bound to the keydown event to be executed, and calls the browser's default keydown action on the matching element(s). This default action can be prevented by returning false from one of the functions bound to the keydown event. The keydown event usually fires when a key on the keyboard is pressed.
				</p>
  </d:entry>
  <d:entry id="id4666492" d:title="Events/keydown(fn)">
    <d:index d:value="keydown" d:title="Events/keydown(fn)"/>
    <p class="title">Events/keydown(fn)</p>
    <p>
					Bind a function to the keydown event of each matched element.
				</p>
    <p>
					The keydown event fires when a key on the keyboard is pressed.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>fn (<span class="arg-type" title="A reference to a Javascript function.">Function</span>)</span>
    						- 
						A function to bind to the keydown event on each of the matched elements.
&lt;pre&gt;function callback(eventObject) {
  this; // dom element
}
&lt;/pre&gt;
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						To perform actions in response to keyboard presses on a page, try:
					</p>
    <pre>
      <code class="javascript">$(window).keydown(function(event){
  switch (event.keyCode) {
    // ...
    // different keys do different things
    // Different browsers provide different codes
    // see here for details: http://unixpapa.com/js/key.html    
    // ...
  }
});
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4666543" d:title="Events/keypress()">
    <d:index d:value="keypress" d:title="Events/keypress()"/>
    <p class="title">Events/keypress()</p>
    <p>
					Triggers the keypress event of each matched element.
				</p>
    <p>
					This causes all of the functions that have been bound to the keypress event to be executed, and calls the browser's default keypress action on the matching element(s). This default action can be prevented by returning false from one of the functions bound to the keypress event. The keypress event usually fires when a key on the keyboard is pressed.
				</p>
  </d:entry>
  <d:entry id="id4666568" d:title="Events/keypress(fn)">
    <d:index d:value="keypress" d:title="Events/keypress(fn)"/>
    <p class="title">Events/keypress(fn)</p>
    <p>
					Binds a function to the keypress event of each matched element.
				</p>
    <p>
					The keypress event fires when a key on the keyboard is "clicked". A keypress is defined as a keydown and keyup on the same key. The sequence of these events is: &lt;ul&gt;&lt;li&gt;keydown&lt;/li&gt;&lt;li&gt;keypress&lt;/li&gt;&lt;li&gt;keyup&lt;/li&gt;&lt;/ul&gt;
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>fn (<span class="arg-type" title="A reference to a Javascript function.">Function</span>)</span>
    						- 
						A function to bind to the keypress event on each of the matched elements.
&lt;pre&gt;function callback(eventObject) {
  this; // dom element
}
&lt;/pre&gt;
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Show spaces and letters when typed.
					</p>
    <pre>
      <code class="javascript">$("input").keypress(function (e) {
      if (e.which == 32 || (65 &lt;= e.which &amp;&amp; e.which &lt;= 65 + 25)
                        || (97 &lt;= e.which &amp;&amp; e.which &lt;= 97 + 25)) {
        var c = String.fromCharCode(e.which);
        $("p").append($("&lt;span/&gt;"))
              .children(":last")
              .append(document.createTextNode(c));
      } else if (e.which == 8) {
        // backspace in IE only be on keydown
        $("p").children(":last").remove();
      }
      $("div").text(e.which);
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;input type="text" /&gt;
  &lt;p&gt;Add text - &lt;/p&gt;
  &lt;div&gt;&lt;/div&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4666626" d:title="Events/keyup()">
    <d:index d:value="keyup" d:title="Events/keyup()"/>
    <p class="title">Events/keyup()</p>
    <p>
					Triggers the keyup event of each matched element.
				</p>
    <p>
					This causes all of the functions that have been bound to the keyup event to be executed, and calls the browser's default keyup action on the matching element(s). This default action can be prevented by returning false from one of the functions bound to the keyup event. The keyup event usually fires when a key on the keyboard is released.
				</p>
  </d:entry>
  <d:entry id="id4666650" d:title="Events/keyup(fn)">
    <d:index d:value="keyup" d:title="Events/keyup(fn)"/>
    <p class="title">Events/keyup(fn)</p>
    <p>
					Bind a function to the keyup event of each matched element.
				</p>
    <p>
					The keyup event fires when a key on the keyboard is released.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>fn (<span class="arg-type" title="A reference to a Javascript function.">Function</span>)</span>
    						- 
						A function to bind to the keyup event on each of the matched elements.
&lt;pre&gt;function callback(eventObject) {
  this; // dom element
}
&lt;/pre&gt;
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						To perform an action when the escape key has been released:
					</p>
    <pre>
      <code class="javascript">$(document).keyup(function(event){
    if (event.keyCode == 27) {
        alert('escaped!');
    }
});
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4603531" d:title="Selectors/last()">
    <d:index d:value="last" d:title="Selectors/last()"/>
    <p class="title">Selectors/last()</p>
    <p>
					Matches the last selected element.
				</p>
    <p>
					
				</p>
    <h2>Example:</h2>
    <p>
						Finds the last table row.
					</p>
    <pre>
      <code class="javascript">$("tr:last").css({backgroundColor: 'yellow', fontWeight: 'bolder'});
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;table&gt;
    &lt;tr&gt;&lt;td&gt;First Row&lt;/td&gt;&lt;/tr&gt;
    &lt;tr&gt;&lt;td&gt;Middle Row&lt;/td&gt;&lt;/tr&gt;
    &lt;tr&gt;&lt;td&gt;Last Row&lt;/td&gt;&lt;/tr&gt;
  &lt;/table&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4605054" d:title="Selectors/lastChild()">
    <d:index d:value="lastChild" d:title="Selectors/lastChild()"/>
    <p class="title">Selectors/lastChild()</p>
    <p>
					Matches all elements that are the last child of their parent.
				</p>
    <p>
					While 
&lt;a href='Selectors/last'&gt;:last&lt;/a&gt;					 matches only a single element, this matches more then one: One for each parent.
				</p>
    <h2>Example:</h2>
    <p>
						Finds the last span in each matched div and adds some css plus a hover state.
					</p>
    <pre>
      <code class="javascript">$("div span:last-child")
        .css({color:"red", fontSize:"80%"})
        .hover(function () {
              $(this).addClass("solast");
            }, function () {
              $(this).removeClass("solast");
            });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div&gt;
    &lt;span&gt;John,&lt;/span&gt;
    &lt;span&gt;Karl,&lt;/span&gt;
    &lt;span&gt;Brandon,&lt;/span&gt;
    &lt;span&gt;Sam&lt;/span&gt;
  &lt;/div&gt;
  &lt;div&gt;
    &lt;span&gt;Glen,&lt;/span&gt;
    &lt;span&gt;Tane,&lt;/span&gt;
    &lt;span&gt;Ralph,&lt;/span&gt;
    &lt;span&gt;David&lt;/span&gt;
  &lt;/div&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4601433" d:title="Core/length">
    <d:index d:value="length" d:title="Core/length"/>
    <p class="title">Core/length</p>
    <p>
					The number of elements in the jQuery object.
				</p>
    <p>
					The number of elements currently matched. The 
&lt;a href='Core/size'&gt;size&lt;/a&gt;					 function will return the same value.
				</p>
    <h2>Example:</h2>
    <p>
						Count the divs.  Click to add more.
					</p>
    <pre>
      <code class="javascript">$(document.body).click(function () {
      $(document.body).append($("&lt;div&gt;"));
      var n = $("div").length;
      $("span").text("There are " + n + " divs." +
                     "Click to add more.");
    }).trigger('click'); // trigger the click to start
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;span&gt;&lt;/span&gt;
  &lt;div&gt;&lt;/div&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4612663" d:title="Events/live(type, fn)">
    <d:index d:value="live" d:title="Events/live(type, fn)"/>
    <p class="title">Events/live(type, fn)</p>
    <p>
					'''Added in jQuery 1.3:''' Binds a handler to an event (like click) for all current - and future - matched element.  Can also bind custom events.
				</p>
    <p>
					'''Possible event values:''' &lt;code&gt;click&lt;/code&gt;, &lt;code&gt;dblclick&lt;/code&gt;, &lt;code&gt; mousedown&lt;/code&gt;, &lt;code&gt;mouseup&lt;/code&gt;, &lt;code&gt;mousemove&lt;/code&gt;, &lt;code&gt;mouseover&lt;/code&gt;, &lt;code&gt;mouseout&lt;/code&gt;, &lt;code&gt;keydown&lt;/code&gt;, &lt;code&gt;keypress&lt;/code&gt;, &lt;code&gt;keyup&lt;/code&gt; &lt;br&gt; '''Currently not supported:''' &lt;code&gt;blur&lt;/code&gt;, &lt;code&gt;focus&lt;/code&gt;, &lt;code&gt;mouseenter&lt;/code&gt;, &lt;code&gt;mouseleave&lt;/code&gt;, &lt;code&gt;change&lt;/code&gt;, &lt;code&gt;submit&lt;/code&gt;<br xmlns=""/><br xmlns=""/>&lt;p&gt;Unlike .bind(), only a single event can be bound in each call to the .live() method.&lt;/p&gt;<br xmlns=""/><br xmlns=""/>&lt;p&gt;This method works and behaves very similarly to jQuery's bind method but with a few important distinctions:&lt;/p&gt;
* When you bind a "live" event it will bind to all current and future elements on the page (using [http://www.sitepoint.com/blogs/2008/07/23/javascript-event-delegation-is-easier-than-you-think/ event delegation]). For example if you bound a live click to all "li" elements on the page then added another li at a later time - that click event would continue to work for the new element (this is not the case with bind which must be re-bound on all new elements).
* Live events do not bubble in the traditional manner and cannot be stopped using stopPropagation or stopImmediatePropagation. For example, take the case of two click events - one bound to "li" and another "li a". Should a click occur on the inner anchor BOTH events will be triggered. This is because when a &lt;code&gt;$("li").bind("click", fn);&lt;/code&gt; is bound you're actually saying "Whenever a click event occurs on an LI element - or inside an LI element - trigger this click event."  To stop further processing for a live event, &lt;code&gt;fn&lt;/code&gt; must return false. This also means, that if any of the parent nodes for the "li" has a click event handler that returns false, the click event will never reach the document node, and as a consequence the live event will never be triggered.
* Live events currently only work when used against a selector. For example, this would work: &lt;code&gt;$("li a").live(...)&lt;/code&gt; but this would not: &lt;code&gt;$("a", someElement).live(...)&lt;/code&gt; and neither would this: &lt;code&gt;$("a").parent().live(...)&lt;/code&gt;.<br xmlns=""/><br xmlns=""/>&lt;p&gt;.live() behaves similarly to the popular [http://plugins.jquery.com/project/livequery liveQuery] plugin but with a few major differences:&lt;/p&gt;
* .live (currently) supports a subset of all events. Note the full list of supported/not-supported events above.
* .live doesn't support the no-event style callback that liveQuery provides. Only event handlers can be bound with .live.
* .live doesn't have a "setup" or "cleanup" step, since all events are delegated rather than bound directly to an element.<br xmlns=""/><br xmlns=""/>&lt;p&gt;To remove a live event you should use the die method.&lt;/p&gt;
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>type (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						An event type
					</li>
        <li><span>fn (<span class="arg-type" title="A reference to a Javascript function.">Function</span>)</span>
    						- 
						A function to bind to the event on each of the set of matched elements
&lt;pre&gt;function callback(eventObject) {
  this; // dom element
}
&lt;/pre&gt;
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Click a paragraph to add another. Note that live binds the click event to all paragraphs - even new ones.
					</p>
    <pre>
      <code class="javascript">$("p").live("click", function(){
      $(this).after("&lt;p&gt;Another paragraph!&lt;/p&gt;");
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;Click me!&lt;/p&gt;
  &lt;span&gt;&lt;/span&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						To display each paragraph's text in an alert box whenever it is clicked:
					</p>
    <pre>
      <code class="javascript">$("p").live("click", function(){
  alert( $(this).text() );
});
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						To cancel a default action and prevent it from bubbling up, return false:
					</p>
    <pre>
      <code class="javascript">$("a").live("click", function() { return false; })
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						To cancel only the default action by using the preventDefault method.
					</p>
    <pre>
      <code class="javascript">$("a").live("click", function(event){
  event.preventDefault();
});
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Can bind custom events too.
					</p>
    <pre>
      <code class="javascript">$("p").live("myCustomEvent", function(e, myName, myValue){
      $(this).text("Hi there!");
      $("span").stop().css("opacity", 1)
               .text("myName = " + myName)
               .fadeIn(30).fadeOut(1000);
    });
    $("button").click(function () {
      $("p").trigger("myCustomEvent");
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;Has an attached custom event.&lt;/p&gt;
  &lt;button&gt;Trigger custom event&lt;/button&gt;
  &lt;span style="display:none;"&gt;&lt;/span&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4669978" d:title="Ajax/load(url, data, callback)">
    <d:index d:value="load" d:title="Ajax/load(url, data, callback)"/>
    <p class="title">Ajax/load(url, data, callback)</p>
    <p>
					Load HTML from a remote file and inject it into the DOM.
				</p>
    <p>
					&lt;p&gt;A GET request will be performed by default - but if you pass in any extra parameters in the form of an Object/Map (key/value pairs) then a POST will occur. Extra parameters passed as a string will still use a GET request.&lt;/p&gt;<br xmlns=""/><br xmlns=""/>&lt;p&gt;&lt;b&gt;Note: &lt;/b&gt;Keep in mind that Internet Explorer caches the loaded file, so you should pass some extra random GET parameter to prevent caching if you plan to call this function more than once&lt;/p&gt;<br xmlns=""/><br xmlns=""/>&lt;p&gt;In jQuery 1.2 you can now specify a jQuery selector in the URL. Doing so will filter the incoming HTML document, only injecting the elements that match the selector. The syntax looks something like "url #some &gt; selector". Default selector "body&gt;*" always applies. If the URL contains a space it should be escape()d. See the examples for more information.&lt;/p&gt;
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>url (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						The URL of the HTML page to load.
					</li>
        <li><span>data (<span class="arg-type" title="">Map,String</span>)</span>
    						- 
						Key/value pairs that will be sent to the server. As of jQuery 1.3 a data string can be passed in instead. When using a string, the request is made as a GET. When using an object/map (key/value pairs), the request is made as a POST.
					</li>
        <li><span>callback (<span class="arg-type" title="">Callback</span>)</span>
    						- 
						The function called when the ajax request is complete (not necessarily success).
&lt;pre&gt;function (responseText, textStatus, XMLHttpRequest) {
  this; // dom element
}
&lt;/pre&gt;
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Load a piece of the documentation sidebar navigation into a custom unordered list.
					</p>
    <pre>
      <code class="javascript">$("#links").load("/Main_Page #jq-p-Getting-Started li");
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;b&gt;jQuery Links:&lt;/b&gt;
&lt;ul id="links"&gt;&lt;/ul&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Load the feeds.html file into the div with the ID of feeds.
					</p>
    <pre>
      <code class="javascript">$("#feeds").load("feeds.html");
					</code>
    </pre>
    <h3>Result:</h3>
    <pre>
      <code class="html">&lt;div id="feeds"&gt;&lt;b&gt;45&lt;/b&gt; feeds found.&lt;/div&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						pass arrays of data to the server.
					</p>
    <pre>
      <code class="javascript">$("#objectID").load("test.php", { 'choices[]': ["Jon", "Susan"] } );
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Same as above, but will POST the additional parameters to the server and a callback that is executed when the server is finished responding.
					</p>
    <pre>
      <code class="javascript">$("#feeds").load("feeds.php", {limit: 25}, function(){
   alert("The last 25 entries in the feed have been loaded");
 });
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4666696" d:title="Events/load (fn)">
    <d:index d:value="load " d:title="Events/load (fn)"/>
    <p class="title">Events/load (fn)</p>
    <p>
					Binds a function to the load event of each matched element.
				</p>
    <p>
					When bound to the window element, the event fires when the user agent finishes loading all content within a document, including window, frames, objects and images. For elements, it fires when the target element and all of its content has finished loading. Note: load will work only if you set it before the element has completely loaded, if you set it after that nothing will happen. This doesn't happen in $(document).ready(), which jQuery handles it to work as expected, also when setting it after the DOM has loaded.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>fn (<span class="arg-type" title="A reference to a Javascript function.">Function</span>)</span>
    						- 
						A function to bind to the load event on each of the matched elements.
&lt;pre&gt;function callback(eventObject) {
  this; // dom element
}
&lt;/pre&gt;
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Run a function when the page is fully loaded including graphics.
					</p>
    <pre>
      <code class="javascript">$(window).load(function () {
  // run code
});
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Add the class bigImg to all images with size greater then 100 upon each image load.
					</p>
    <pre>
      <code class="javascript">$('img.userIcon').load(function(){
  if($(this).height() &gt; 100) {
    $(this).addClass('bigImg');
  }
});
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4603860" d:title="Selectors/lt(index)">
    <d:index d:value="lt" d:title="Selectors/lt(index)"/>
    <p class="title">Selectors/lt(index)</p>
    <p>
					Matches all elements with an index below the given one.
				</p>
    <p>
					
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>index (<span class="arg-type" title="A valid numeric.">Number</span>)</span>
    						- 
						Zero-based index.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Finds TDs less than the one with the 4th index (TD#4).
					</p>
    <pre>
      <code class="javascript">$("td:lt(4)").css("color", "red");
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;table border="1"&gt;
    &lt;tr&gt;&lt;td&gt;TD #0&lt;/td&gt;&lt;td&gt;TD #1&lt;/td&gt;&lt;td&gt;TD #2&lt;/td&gt;&lt;/tr&gt;
    &lt;tr&gt;&lt;td&gt;TD #3&lt;/td&gt;&lt;td&gt;TD #4&lt;/td&gt;&lt;td&gt;TD #5&lt;/td&gt;&lt;/tr&gt;
    &lt;tr&gt;&lt;td&gt;TD #6&lt;/td&gt;&lt;td&gt;TD #7&lt;/td&gt;&lt;td&gt;TD #8&lt;/td&gt;&lt;/tr&gt;
  &lt;/table&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4607368" d:title="Traversing/map(callback)">
    <d:index d:value="map" d:title="Traversing/map(callback)"/>
    <p class="title">Traversing/map(callback)</p>
    <p>
					Translate a set of elements in the jQuery object into another set of values in a jQuery array (which may, or may not contain elements).
				</p>
    <p>
					You could use this to build lists of values, attributes, css values - or even perform special, custom, selector transformations.<br xmlns=""/><br xmlns=""/>This is provided as a convenience method for using 
&lt;a href='Utilities/jQuery.map'&gt;$.map()&lt;/a&gt;					.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>callback (<span class="arg-type" title="A reference to a Javascript function.">Function</span>)</span>
    						- 
						The function to execute on each element in the set.
&lt;pre&gt;function callback(index, domElement) {
  var replacement;

  this; // also dom element

  // replacement == null : delete spot
  // replacement == array : insert the elements of the array
  // else replace the spot with replacement
  return replacement;
}
&lt;/pre&gt;
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Build a list of all the values within a form.
					</p>
    <pre>
      <code class="javascript">$("p").append( $("input").map(function(){
      return $(this).val();
    }).get().join(", ") );

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;&lt;b&gt;Values: &lt;/b&gt;&lt;/p&gt;
  &lt;form&gt;
    &lt;input type="text" name="name" value="John"/&gt;
    &lt;input type="text" name="password" value="password"/&gt;
    &lt;input type="text" name="url" value="http://ejohn.org/"/&gt;
  &lt;/form&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						A contrived example to show some functionality.
					</p>
    <pre>
      <code class="javascript">var mappedItems = $("li").map(function (index) {
      var replacement = $("&lt;li&gt;").text($(this).text()).get(0);
      if (index == 0) {
        // make the first item all caps
        $(replacement).text($(replacement).text().toUpperCase());
      } else if (index == 1 || index == 3) {
        // delete the second and fourth items
        replacement = null;
      } else if (index == 2) {
        // make two of the third item and add some text
        replacement = [replacement,$("&lt;li&gt;").get(0)];
        $(replacement[0]).append("&lt;b&gt; - A&lt;/b&gt;");
        $(replacement[1]).append("Extra &lt;b&gt; - B&lt;/b&gt;");
      }

      // replacement will be an dom element, null, 
      // or an array of dom elements
      return replacement;
    });
    $("#results").append(mappedItems);

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;ul&gt;
    &lt;li&gt;First&lt;/li&gt;
    &lt;li&gt;Second&lt;/li&gt;
    &lt;li&gt;Third&lt;/li&gt;
    &lt;li&gt;Fourth&lt;/li&gt;
    &lt;li&gt;Fifth&lt;/li&gt;
  &lt;/ul&gt;
  &lt;ul id="results"&gt;
  &lt;/ul&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4666755" d:title="Events/mousedown (fn)">
    <d:index d:value="mousedown " d:title="Events/mousedown (fn)"/>
    <p class="title">Events/mousedown (fn)</p>
    <p>
					Binds a function to the mousedown event of each matched element.
				</p>
    <p>
					The mousedown event fires when the pointing device button is pressed over an element.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>fn (<span class="arg-type" title="A reference to a Javascript function.">Function</span>)</span>
    						- 
						A function to bind to the mousedown event on each of the matched elements.
&lt;pre&gt;function callback(eventObject) {
  this; // dom element
}
&lt;/pre&gt;
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Show texts when mouseup and mousedown event triggering.
					</p>
    <pre>
      <code class="javascript">$("p").mouseup(function(){
      $(this).append('&lt;span style="color:#F00;"&gt;Mouse up.&lt;/span&gt;');
    }).mousedown(function(){
      $(this).append('&lt;span style="color:#00F;"&gt;Mouse down.&lt;/span&gt;');
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;Press mouse and release here.&lt;/p&gt;

					</code>
    </pre>
  </d:entry>
  <d:entry id="id4666810" d:title="Events/mouseenter(fn)">
    <d:index d:value="mouseenter" d:title="Events/mouseenter(fn)"/>
    <p class="title">Events/mouseenter(fn)</p>
    <p>
					Bind a function to the mouseenter event of each matched element.
				</p>
    <p>
					The mouseenter event fires once when the pointing device is moved into an element.<br xmlns=""/><br xmlns=""/>
This convenience method was added in jQuery 1.3. Previously the mouseenter event was available via bind.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>fn (<span class="arg-type" title="A reference to a Javascript function.">Function</span>)</span>
    						- 
						A function to bind to the mouseenter event on each of the matched elements.
&lt;pre&gt;function callback(eventObject) {
  this; // dom element
}
&lt;/pre&gt;
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Show texts when mouseenter and mouseout event triggering.
'''Mouseover''' fires when the pointer moves into or out from child element, while '''mouseenter''' doesn't.
					</p>
    <pre>
      <code class="javascript">var i = 0;
    $("div.overout").mouseover(function(){
      $("p:first",this).text("mouse over");
      $("p:last",this).text(++i);
    }).mouseout(function(){
      $("p:first",this).text("mouse out");
    });

    var n = 0;
    $("div.enterleave").mouseenter(function(){
      $("p:first",this).text("mouse enter");
      $("p:last",this).text(++n);
    }).mouseleave(function(){
      $("p:first",this).text("mouse leave");
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div class="out overout"&gt;&lt;p&gt;move your mouse&lt;/p&gt;&lt;div class="in overout"&gt;&lt;p&gt;move your mouse&lt;/p&gt;&lt;p&gt;0&lt;/p&gt;&lt;/div&gt;&lt;p&gt;0&lt;/p&gt;&lt;/div&gt;
&lt;div class="out enterleave"&gt;&lt;p&gt;move your mouse&lt;/p&gt;&lt;div class="in enterleave"&gt;&lt;p&gt;move your mouse&lt;/p&gt;&lt;p&gt;0&lt;/p&gt;&lt;/div&gt;&lt;p&gt;0&lt;/p&gt;&lt;/div&gt;

					</code>
    </pre>
  </d:entry>
  <d:entry id="id4666888" d:title="Events/mouseleave(fn)">
    <d:index d:value="mouseleave" d:title="Events/mouseleave(fn)"/>
    <p class="title">Events/mouseleave(fn)</p>
    <p>
					Bind a function to the mouseleave event of each matched element.
				</p>
    <p>
					The mouseleave event fires once when the pointing device is moved away from an element.<br xmlns=""/><br xmlns=""/>
This convenience method was added in jQuery 1.3. Previously the mouseleave event was available via bind.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>fn (<span class="arg-type" title="A reference to a Javascript function.">Function</span>)</span>
    						- 
						A function to bind to the mouseleave event on each of the matched elements.
&lt;pre&gt;function callback(eventObject) {
  this; // dom element
}
&lt;/pre&gt;
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Show texts when mouseover and mouseleave event triggering.
'''Mouseout''' fires when the pointer moves into or out from child element, while '''mouseleave''' doesn't.
					</p>
    <pre>
      <code class="javascript">var i = 0;
    $("div.overout").mouseout(function(){
      $("p:first",this).text("mouse out");
      $("p:last",this).text(++i);
    }).mouseover(function(){
      $("p:first",this).text("mouse over");
    });

    var n = 0;
    $("div.enterleave").mouseenter(function(){
      $("p:first",this).text("mouse enter");
    }).mouseleave(function(){
      $("p:first",this).text("mouse leave");
      $("p:last",this).text(++n);
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div class="out overout"&gt;&lt;p&gt;move your mouse&lt;/p&gt;&lt;div class="in overout"&gt;&lt;p&gt;move your mouse&lt;/p&gt;&lt;p&gt;0&lt;/p&gt;&lt;/div&gt;&lt;p&gt;0&lt;/p&gt;&lt;/div&gt;
&lt;div class="out enterleave"&gt;&lt;p&gt;move your mouse&lt;/p&gt;&lt;div class="in enterleave"&gt;&lt;p&gt;move your mouse&lt;/p&gt;&lt;p&gt;0&lt;/p&gt;&lt;/div&gt;&lt;p&gt;0&lt;/p&gt;&lt;/div&gt;

					</code>
    </pre>
  </d:entry>
  <d:entry id="id4666962" d:title="Events/mousemove(fn)">
    <d:index d:value="mousemove" d:title="Events/mousemove(fn)"/>
    <p class="title">Events/mousemove(fn)</p>
    <p>
					Bind a function to the mousemove event of each matched element.
				</p>
    <p>
					The mousemove event fires when the pointing device is moved while it is over an element. The event handler is passed one variable - the event object. Its .clientX and .clientY properties represent the coordinates of the mouse.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>fn (<span class="arg-type" title="A reference to a Javascript function.">Function</span>)</span>
    						- 
						A function to bind to the mousmove event on each of the matched elements.
&lt;pre&gt;function callback(eventObject) {
  this; // dom element
}
&lt;/pre&gt;
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Show the mouse coordinates when the mouse is moved over the yellow div.  Coordinates are relative to the window which in this case is the iframe.
					</p>
    <pre>
      <code class="javascript">$("div").mousemove(function(e){
      var pageCoords = "( " + e.pageX + ", " + e.pageY + " )";
      var clientCoords = "( " + e.clientX + ", " + e.clientY + " )";
      $("span:first").text("( e.pageX, e.pageY ) - " + pageCoords);
      $("span:last").text("( e.clientX, e.clientY ) - " + clientCoords);
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;   
    Try scrolling too.
    &lt;span&gt;Move the mouse over the div.&lt;/span&gt;
    &lt;span&gt;&amp;nbsp;&lt;/span&gt;
  &lt;/p&gt;
  &lt;div&gt;&lt;/div&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4667033" d:title="Events/mouseout(fn)">
    <d:index d:value="mouseout" d:title="Events/mouseout(fn)"/>
    <p class="title">Events/mouseout(fn)</p>
    <p>
					Bind a function to the mouseout event of each matched element.
				</p>
    <p>
					The mouseout event fires when the pointing device is moved away from an element.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>fn (<span class="arg-type" title="A reference to a Javascript function.">Function</span>)</span>
    						- 
						A function to bind to the mouseout event on each of the matched elements.
&lt;pre&gt;function callback(eventObject) {
  this; // dom element
}
&lt;/pre&gt;
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Show texts when mouseover and mouseout event triggering.
'''Mouseout''' fires when the pointer moves into or out from child element, while '''mouseleave''' doesn't.
					</p>
    <pre>
      <code class="javascript">var i = 0;
    $("div.overout").mouseout(function(){
      $("p:first",this).text("mouse out");
      $("p:last",this).text(++i);
    }).mouseover(function(){
      $("p:first",this).text("mouse over");
    });

    var n = 0;
    $("div.enterleave").bind("mouseenter",function(){
      $("p:first",this).text("mouse enter");
    }).bind("mouseleave",function(){
      $("p:first",this).text("mouse leave");
      $("p:last",this).text(++n);
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div class="out overout"&gt;&lt;p&gt;move your mouse&lt;/p&gt;&lt;div class="in overout"&gt;&lt;p&gt;move your mouse&lt;/p&gt;&lt;p&gt;0&lt;/p&gt;&lt;/div&gt;&lt;p&gt;0&lt;/p&gt;&lt;/div&gt;
&lt;div class="out enterleave"&gt;&lt;p&gt;move your mouse&lt;/p&gt;&lt;div class="in enterleave"&gt;&lt;p&gt;move your mouse&lt;/p&gt;&lt;p&gt;0&lt;/p&gt;&lt;/div&gt;&lt;p&gt;0&lt;/p&gt;&lt;/div&gt;

					</code>
    </pre>
  </d:entry>
  <d:entry id="id4667108" d:title="Events/mouseover(fn)">
    <d:index d:value="mouseover" d:title="Events/mouseover(fn)"/>
    <p class="title">Events/mouseover(fn)</p>
    <p>
					Bind a function to the mouseover event of each matched element.
				</p>
    <p>
					The mouseover event fires when the pointing device is moved onto an element.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>fn (<span class="arg-type" title="A reference to a Javascript function.">Function</span>)</span>
    						- 
						A function to bind to the mouseover event on each of the matched elements.
&lt;pre&gt;function callback(eventObject) {
  this; // dom element
}
&lt;/pre&gt;
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Show texts when mouseover and mouseout event triggering.
'''Mouseover''' fires when the pointer moves into or out from child element, while '''mouseenter''' does't.
					</p>
    <pre>
      <code class="javascript">var i = 0;
    $("div.overout").mouseover(function(){
      $("p:first",this).text("mouse over");
      $("p:last",this).text(++i);
    }).mouseout(function(){
      $("p:first",this).text("mouse out");
    });

    var n = 0;
    $("div.enterleave").bind("mouseenter",function(){
      $("p:first",this).text("mouse enter");
      $("p:last",this).text(++n);
    }).bind("mouseleave",function(){
      $("p:first",this).text("mouse leave");
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div class="out overout"&gt;&lt;p&gt;move your mouse&lt;/p&gt;&lt;div class="in overout"&gt;&lt;p&gt;move your mouse&lt;/p&gt;&lt;p&gt;0&lt;/p&gt;&lt;/div&gt;&lt;p&gt;0&lt;/p&gt;&lt;/div&gt;
&lt;div class="out enterleave"&gt;&lt;p&gt;move your mouse&lt;/p&gt;&lt;div class="in enterleave"&gt;&lt;p&gt;move your mouse&lt;/p&gt;&lt;p&gt;0&lt;/p&gt;&lt;/div&gt;&lt;p&gt;0&lt;/p&gt;&lt;/div&gt;

					</code>
    </pre>
  </d:entry>
  <d:entry id="id4667181" d:title="Events/mouseup(fn)">
    <d:index d:value="mouseup" d:title="Events/mouseup(fn)"/>
    <p class="title">Events/mouseup(fn)</p>
    <p>
					Bind a function to the mouseup event of each matched element.
				</p>
    <p>
					The mouseup event fires when the pointing device button is released over an element.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>fn (<span class="arg-type" title="A reference to a Javascript function.">Function</span>)</span>
    						- 
						A function to bind to the mouseup event on each of the matched elements.
&lt;pre&gt;function callback(eventObject) {
  this; // dom element
}
&lt;/pre&gt;
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Show texts when mouseup and mousedown event triggering.
					</p>
    <pre>
      <code class="javascript">$("p").mouseup(function(){
      $(this).append('&lt;span style="color:#F00;"&gt;Mouse up.&lt;/span&gt;');
    }).mousedown(function(){
      $(this).append('&lt;span style="color:#00F;"&gt;Mouse down.&lt;/span&gt;');
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;Press mouse and release here.&lt;/p&gt;

					</code>
    </pre>
  </d:entry>
  <d:entry id="id4603044" d:title="Selectors/multiple(selector1, selector2, selectorN)">
    <d:index d:value="multiple" d:title="Selectors/multiple(selector1, selector2, selectorN)"/>
    <p class="title">Selectors/multiple(selector1, selector2, selectorN)</p>
    <p>
					Matches the combined results of all the specified selectors.
				</p>
    <p>
					You can specify any number of selectors to combine into a single result.  Note order of the dom elements in the jQuery object aren't necessarily identical.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>selector1 (<span class="arg-type" title="">Selector</span>)</span>
    						- 
						Any valid selector
					</li>
        <li><span>selector2 (<span class="arg-type" title="">Selector</span>)</span>
    						- 
						Another valid selector
					</li>
        <li><span>selectorN (<span class="arg-type" title="">Selector</span>)</span>
    						- 
						As many more valid selectors as you like
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Finds the elements that match any of these three selectors.
					</p>
    <pre>
      <code class="javascript">$("div,span,p.myClass").css("border","3px solid red");
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div&gt;div&lt;/div&gt;
  &lt;p class="myClass"&gt;p class="myClass"&lt;/p&gt;
  &lt;p class="notMyClass"&gt;p class="notMyClass"&lt;/p&gt;
  &lt;span&gt;span&lt;/span&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Show the order in the jQuery object.
					</p>
    <pre>
      <code class="javascript">var list = $("div,p,span").map(function () {
      return this.tagName;
    }).get().join(", ");
    $("b").append(document.createTextNode(list));

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;span&gt;span&lt;/span&gt;
  &lt;p&gt;p&lt;/p&gt;
  &lt;p&gt;p&lt;/p&gt;
  &lt;div&gt;div&lt;/div&gt;
  &lt;span&gt;span&lt;/span&gt;
  &lt;p&gt;p&lt;/p&gt;
  &lt;div&gt;div&lt;/div&gt;
  &lt;b&gt;&lt;/b&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4608161" d:title="Traversing/next(expr)">
    <d:index d:value="next" d:title="Traversing/next(expr)"/>
    <p class="title">Traversing/next(expr)</p>
    <p>
					Get a set of elements containing the unique next siblings of each of the given set of elements.
				</p>
    <p>
					next only returns the very next sibling for each element, not all next siblings (see nextAll).<br xmlns=""/><br xmlns=""/>You may provide an optional expression to filter the returned set. 
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>expr (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						An expression with which to filter the returned set.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Find the very next sibling of each disabled button and change its text "this button is disabled".
					</p>
    <pre>
      <code class="javascript">$("button[disabled]").next().text("this button is disabled");
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div&gt;&lt;button disabled="disabled"&gt;First&lt;/button&gt; - &lt;span&gt;&lt;/span&gt;&lt;/div&gt;
  &lt;div&gt;&lt;button&gt;Second&lt;/button&gt; - &lt;span&gt;&lt;/span&gt;&lt;/div&gt;
  &lt;div&gt;&lt;button disabled="disabled"&gt;Third&lt;/button&gt; - &lt;span&gt;&lt;/span&gt;&lt;/div&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Find the very next sibling of each paragraph. Keep only the ones with a class "selected".
					</p>
    <pre>
      <code class="javascript">$("p").next(".selected").css("background", "yellow");
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;Hello&lt;/p&gt;
  &lt;p class="selected"&gt;Hello Again&lt;/p&gt;
  &lt;div&gt;&lt;span&gt;And Again&lt;/span&gt;&lt;/div&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4603320" d:title="Selectors/next(prev, next)">
    <d:index d:value="next" d:title="Selectors/next(prev, next)"/>
    <p class="title">Selectors/next(prev, next)</p>
    <p>
					Matches all next elements specified by "next" that are next to elements specified by "prev".
				</p>
    <p>
					
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>prev (<span class="arg-type" title="">Selector</span>)</span>
    						- 
						Any valid selector.
					</li>
        <li><span>next (<span class="arg-type" title="">Selector</span>)</span>
    						- 
						A selector to match elements that are next to the first selector.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Finds all inputs that are next to a label.
					</p>
    <pre>
      <code class="javascript">$("label + input").css("color", "blue").val("Labeled!")
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;form&gt;
    &lt;label&gt;Name:&lt;/label&gt;
    &lt;input name="name" /&gt;
    &lt;fieldset&gt;
      &lt;label&gt;Newsletter:&lt;/label&gt;
      &lt;input name="newsletter" /&gt;
    &lt;/fieldset&gt;
  &lt;/form&gt;
  &lt;input name="none" /&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4608246" d:title="Traversing/nextAll(expr)">
    <d:index d:value="nextAll" d:title="Traversing/nextAll(expr)"/>
    <p class="title">Traversing/nextAll(expr)</p>
    <p>
					Find all sibling elements after the current element.
				</p>
    <p>
					Use an optional expression to filter the matched set. 
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>expr (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						An expression to filter the next Elements with.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Locate all the divs after the first and give them a class.
					</p>
    <pre>
      <code class="javascript">$("div:first").nextAll().addClass("after");
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div&gt;first&lt;/div&gt;
  &lt;div&gt;sibling&lt;div&gt;child&lt;/div&gt;&lt;/div&gt;
  &lt;div&gt;sibling&lt;/div&gt;
  &lt;div&gt;sibling&lt;/div&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Locate all the paragraphs after the second child in the body and give them a class.
					</p>
    <pre>
      <code class="javascript">$(":nth-child(1)").nextAll("p").addClass("after");

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;p&lt;/p&gt;
  &lt;div&gt;div&lt;/div&gt;
  &lt;p&gt;p&lt;/p&gt;
  &lt;p&gt;p&lt;/p&gt;
  &lt;div&gt;div&lt;/div&gt;
  &lt;p&gt;p&lt;/p&gt;
  &lt;div&gt;div&lt;/div&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4603577" d:title="Selectors/not(selector)">
    <d:index d:value="not" d:title="Selectors/not(selector)"/>
    <p class="title">Selectors/not(selector)</p>
    <p>
					Filters out all elements matching the given selector.
				</p>
    <p>
					&lt;p&gt;As of jQuery 1.3 :not() also support selectors separated by commas and complex selectors, for example: :not(div a) and :not(div,a).&lt;/p&gt;
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>selector (<span class="arg-type" title="">Selector</span>)</span>
    						- 
						A selector with which to filter by.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Finds all inputs that are not checked and highlights the next sibling span.  Notice there is no change when clicking the checkboxes since no click events have been linked.
					</p>
    <pre>
      <code class="javascript">$("input:not(:checked) + span").css("background-color", "yellow");
    $("input").attr("disabled", "disabled");

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div&gt;
    &lt;input type="checkbox" name="a" /&gt;
    &lt;span&gt;Mary&lt;/span&gt;
  &lt;/div&gt;
  &lt;div&gt;
    &lt;input type="checkbox" name="b" /&gt;
    &lt;span&gt;lcm&lt;/span&gt;
  &lt;/div&gt;
  &lt;div&gt;
    &lt;input type="checkbox" name="c" checked="checked" /&gt;
    &lt;span&gt;Peter&lt;/span&gt;
  &lt;/div&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4607461" d:title="Traversing/not(expr)">
    <d:index d:value="not" d:title="Traversing/not(expr)"/>
    <p class="title">Traversing/not(expr)</p>
    <p>
					Removes elements matching the specified expression from the set of matched elements.
				</p>
    <p>
					
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>expr (<span class="arg-type" title="">String, DOMElement, Array&lt;DOMElement&gt;</span>)</span>
    						- 
						An expression with which to remove matching elements, an element to remove from the set or a set of elements to remove from the jQuery set of matched elements. A jQuery object is also accepted.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Adds a border to divs that are not green or blue.
					</p>
    <pre>
      <code class="javascript">$("div").not(".green, #blueone")
            .css("border-color", "red");

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div&gt;&lt;/div&gt;
  &lt;div id="blueone"&gt;&lt;/div&gt;
  &lt;div&gt;&lt;/div&gt;
  &lt;div class="green"&gt;&lt;/div&gt;
  &lt;div class="green"&gt;&lt;/div&gt;
  &lt;div class="gray"&gt;&lt;/div&gt;
  &lt;div&gt;&lt;/div&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Removes the element with the ID "selected" from the set of all paragraphs.
					</p>
    <pre>
      <code class="javascript">$("p").not( $("#selected")[0] )
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Removes the element with the ID "selected" from the set of all paragraphs.
					</p>
    <pre>
      <code class="javascript">$("p").not("#selected")
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Removes all elements that match "div p.selected" from the total set of all paragraphs.
					</p>
    <pre>
      <code class="javascript">$("p").not($("div p.selected"))
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4604885" d:title="Selectors/nthChild(index)">
    <d:index d:value="nthChild" d:title="Selectors/nthChild(index)"/>
    <p class="title">Selectors/nthChild(index)</p>
    <p>
					Matches all elements that are the nth-child of their parent or that are the parent's even or odd children.
				</p>
    <p>
					While 
&lt;a href='Selectors/eq'&gt;:eq(index)&lt;/a&gt;					 matches only a single element, this matches more than one: One for each parent with index.  Multiple for each parent with even, odd, or equation.<br xmlns=""/><br xmlns=""/>The specified index is one-indexed, in contrast to :eq() which starts at zero.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>index (<span class="arg-type" title="">Number/String</span>)</span>
    						- 
						The index of each child to match, starting with 1 or the string even, odd, or equation ( eg. :nth-child(even), :nth-child(4n) )
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Finds the second li in each matched ul and notes it.
					</p>
    <pre>
      <code class="javascript">$("ul li:nth-child(2)").append("&lt;span&gt; - 2nd!&lt;/span&gt;");
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div&gt;&lt;ul&gt;
    &lt;li&gt;John&lt;/li&gt;
    &lt;li&gt;Karl&lt;/li&gt;
    &lt;li&gt;Brandon&lt;/li&gt;
  &lt;/ul&gt;&lt;/div&gt;
  &lt;div&gt;&lt;ul&gt;
    &lt;li&gt;Sam&lt;/li&gt;
  &lt;/ul&gt;&lt;/div&gt;
  &lt;div&gt;&lt;ul&gt;
    &lt;li&gt;Glen&lt;/li&gt;
    &lt;li&gt;Tane&lt;/li&gt;
    &lt;li&gt;Ralph&lt;/li&gt;
    &lt;li&gt;David&lt;/li&gt;
  &lt;/ul&gt;&lt;/div&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						This is a playground to see how the selector works with different strings.  Notice that this is different from the :even and :odd which have no regard for parent and just filter the list of elements to every other one.  The :nth-child, however, counts the index of the child to its particular parent.  In any case, it's easier to see than explain so...
					</p>
    <pre>
      <code class="javascript">$("button").click(function () {
      var str = $(this).text();
      $("tr").css("background", "white");
      $("tr" + str).css("background", "#ff0000");
      $("#inner").text(str);
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div&gt;
    &lt;button&gt;:nth-child(even)&lt;/button&gt;
    &lt;button&gt;:nth-child(odd)&lt;/button&gt;
    &lt;button&gt;:nth-child(3n)&lt;/button&gt;
    &lt;button&gt;:nth-child(2)&lt;/button&gt;
  &lt;/div&gt;
  &lt;div&gt;
    &lt;button&gt;:nth-child(3n+1)&lt;/button&gt;
    &lt;button&gt;:nth-child(3n+2)&lt;/button&gt;
    &lt;button&gt;:even&lt;/button&gt;
    &lt;button&gt;:odd&lt;/button&gt;
  &lt;/div&gt;
  &lt;div&gt;&lt;table&gt;
    &lt;tr&gt;&lt;td&gt;John&lt;/td&gt;&lt;/tr&gt;
    &lt;tr&gt;&lt;td&gt;Karl&lt;/td&gt;&lt;/tr&gt;
    &lt;tr&gt;&lt;td&gt;Brandon&lt;/td&gt;&lt;/tr&gt;
    &lt;tr&gt;&lt;td&gt;Benjamin&lt;/td&gt;&lt;/tr&gt;
  &lt;/table&gt;&lt;/div&gt;
  &lt;div&gt;&lt;table&gt;
    &lt;tr&gt;&lt;td&gt;Sam&lt;/td&gt;&lt;/tr&gt;
  &lt;/table&gt;&lt;/div&gt;
  &lt;div&gt;&lt;table&gt;
    &lt;tr&gt;&lt;td&gt;Glen&lt;/td&gt;&lt;/tr&gt;
    &lt;tr&gt;&lt;td&gt;Tane&lt;/td&gt;&lt;/tr&gt;
    &lt;tr&gt;&lt;td&gt;Ralph&lt;/td&gt;&lt;/tr&gt;
    &lt;tr&gt;&lt;td&gt;David&lt;/td&gt;&lt;/tr&gt;
    &lt;tr&gt;&lt;td&gt;Mike&lt;/td&gt;&lt;/tr&gt;
    &lt;tr&gt;&lt;td&gt;Dan&lt;/td&gt;&lt;/tr&gt;
  &lt;/table&gt;&lt;/div&gt;
  &lt;span&gt;
    tr&lt;span id="inner"&gt;&lt;/span&gt;
  &lt;/span&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4603696" d:title="Selectors/odd()">
    <d:index d:value="odd" d:title="Selectors/odd()"/>
    <p class="title">Selectors/odd()</p>
    <p>
					Matches odd elements, zero-indexed.  See also even.
				</p>
    <p>
					
				</p>
    <h2>Example:</h2>
    <p>
						Finds odd table rows, matching the second, fourth and so on (index 1, 3, 5 etc.).
					</p>
    <pre>
      <code class="javascript">$("tr:odd").css("background-color", "#bbbbff");
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;table border="1"&gt;
    &lt;tr&gt;&lt;td&gt;Row with Index #0&lt;/td&gt;&lt;/tr&gt;
    &lt;tr&gt;&lt;td&gt;Row with Index #1&lt;/td&gt;&lt;/tr&gt;
    &lt;tr&gt;&lt;td&gt;Row with Index #2&lt;/td&gt;&lt;/tr&gt;
    &lt;tr&gt;&lt;td&gt;Row with Index #3&lt;/td&gt;&lt;/tr&gt;
  &lt;/table&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4611072" d:title="CSS/offset()">
    <d:index d:value="offset" d:title="CSS/offset()"/>
    <p class="title">CSS/offset()</p>
    <p>
					Get the current offset of the first matched element, in pixels, relative to the document.
				</p>
    <p>
					The returned object contains two 
&lt;a href='Types#Float'&gt;Float&lt;/a&gt;					 properties, top and left. Browsers usually round these values to the nearest integer pixel for actual positioning. The method works only with visible elements. 
				</p>
    <h2>Example:</h2>
    <p>
						Access the offset of the second paragraph:
					</p>
    <pre>
      <code class="javascript">var p = $("p:last");
var offset = p.offset();
p.html( "left: " + offset.left + ", top: " + offset.top );
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;Hello&lt;/p&gt;&lt;p&gt;2nd Paragraph&lt;/p&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Click to see the offset.
					</p>
    <pre>
      <code class="javascript">$("*", document.body).click(function (e) {
      var offset = $(this).offset();
      e.stopPropagation();
      $("#result").text(this.tagName + " coords ( " + offset.left + ", " +
                                      offset.top + " )");
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div id="result"&gt;Click an element.&lt;/div&gt;
  &lt;p&gt;
    This is the best way to &lt;span&gt;find&lt;/span&gt; an offset.
  &lt;/p&gt;
  &lt;div class="abs"&gt;
  &lt;/div&gt;
  
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4608334" d:title="Traversing/offsetParent()">
    <d:index d:value="offsetParent" d:title="Traversing/offsetParent()"/>
    <p class="title">Traversing/offsetParent()</p>
    <p>
					Returns a jQuery collection with the positioned parent of the first matched element.
				</p>
    <p>
					This is the first parent of the element that has position (as in relative or absolute). This method only works with visible elements.
				</p>
  </d:entry>
  <d:entry id="id4611154" d:title="Traversing/offsetParent()">
    <d:index d:value="offsetParent" d:title="Traversing/offsetParent()"/>
    <p class="title">Traversing/offsetParent()</p>
    <p>
					Returns a jQuery collection with the positioned parent of the first matched element.
				</p>
    <p>
					This is the first parent of the element that has position (as in relative or absolute). This method only works with visible elements.
				</p>
  </d:entry>
  <d:entry id="id4612190" d:title="Events/one(type, data, fn)">
    <d:index d:value="one" d:title="Events/one(type, data, fn)"/>
    <p class="title">Events/one(type, data, fn)</p>
    <p>
					Binds a handler to one or more events to be executed &lt;i&gt;once&lt;/i&gt; for each matched element.
				</p>
    <p>
					&lt;p&gt;The handler is executed only once for each element. Otherwise, the same rules as described in 
&lt;a href='Events/bind'&gt;bind&lt;/a&gt;					() apply. The event handler is passed an event object that you can use to prevent default behaviour. To stop both default action and event bubbling, your handler should return false.&lt;/p&gt;&lt;p&gt;In most cases, you can define your event handlers as anonymous functions (see first example). In cases where that is not possible, you can pass additional data as the second paramter (and the handler function as the third), see second example.&lt;/p&gt;
&lt;p&gt;'''Possible event values:''' &lt;code&gt;blur&lt;/code&gt;, &lt;code&gt;focus&lt;/code&gt;, &lt;code&gt;load&lt;/code&gt;, &lt;code&gt;resize&lt;/code&gt;, &lt;code&gt;scroll&lt;/code&gt;, &lt;code&gt;unload&lt;/code&gt;, &lt;code&gt;beforeunload&lt;/code&gt;, &lt;code&gt;click&lt;/code&gt;, &lt;code&gt;dblclick&lt;/code&gt;, &lt;code&gt; mousedown&lt;/code&gt;, &lt;code&gt;mouseup&lt;/code&gt;, &lt;code&gt;mousemove&lt;/code&gt;, &lt;code&gt;mouseover&lt;/code&gt;, &lt;code&gt;mouseout&lt;/code&gt;, &lt;code&gt;mouseenter&lt;/code&gt;, &lt;code&gt;mouseleave&lt;/code&gt;, &lt;code&gt;change&lt;/code&gt;, &lt;code&gt;select&lt;/code&gt;, &lt;code&gt; submit&lt;/code&gt;, &lt;code&gt;keydown&lt;/code&gt;, &lt;code&gt;keypress&lt;/code&gt;, &lt;code&gt;keyup&lt;/code&gt;, &lt;code&gt;error&lt;/code&gt;&lt;/p&gt;<br xmlns=""/><br xmlns=""/>				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>type (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						An event type
					</li>
        <li><span>data (<span class="arg-type" title="A simple Javascript object..">Object</span>)</span>
    						- 
						Additional data passed to the event handler as event.data
					</li>
        <li><span>fn (<span class="arg-type" title="A reference to a Javascript function.">Function</span>)</span>
    						- 
						A function to bind to the specified event on each of the matched elements.
&lt;pre&gt;function callback(eventObject) {
  this; // dom element
}
&lt;/pre&gt;
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Tie a one-time click to each div.
					</p>
    <pre>
      <code class="javascript">var n = 0;
    $("div").one("click", function(){
      var index = $("div").index(this);
      $(this).css({ borderStyle:"inset",
                    cursor:"auto" });
      $("p").text("Div at index #" + index + " clicked." +
                  "  That's " + ++n + " total clicks.");
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div&gt;&lt;/div&gt;
  &lt;div&gt;&lt;/div&gt;
  &lt;div&gt;&lt;/div&gt;
  &lt;div&gt;&lt;/div&gt;
  &lt;div&gt;&lt;/div&gt;
  &lt;p&gt;Click a green square...&lt;/p&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						To display the text of all paragraphs in an alert box the first time each of them is clicked:
					</p>
    <pre>
      <code class="javascript">$("p").one("click", function(){
  alert( $(this).text() );
});
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4605116" d:title="Selectors/onlyChild()">
    <d:index d:value="onlyChild" d:title="Selectors/onlyChild()"/>
    <p class="title">Selectors/onlyChild()</p>
    <p>
					Matches all elements that are the only child of their parent.
				</p>
    <p>
					If the parent has other child elements, nothing is matched.
				</p>
    <h2>Example:</h2>
    <p>
						Finds the button with no siblings in each matched div and modifies look.
					</p>
    <pre>
      <code class="javascript">$("div button:only-child").text("Alone").css("border", "2px blue solid");
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div&gt;
    &lt;button&gt;Sibling!&lt;/button&gt;
    &lt;button&gt;Sibling!&lt;/button&gt;
  &lt;/div&gt;
  &lt;div&gt;
    &lt;button&gt;Sibling!&lt;/button&gt;
  &lt;/div&gt;
  &lt;div&gt;
    None
  &lt;/div&gt;
  &lt;div&gt;  
    &lt;button&gt;Sibling!&lt;/button&gt;
    &lt;button&gt;Sibling!&lt;/button&gt;
    &lt;button&gt;Sibling!&lt;/button&gt;
  &lt;/div&gt;
  &lt;div&gt;
    &lt;button&gt;Sibling!&lt;/button&gt;
  &lt;/div&gt;
					</code>
    </pre>
    <h3>Result:</h3>
    <pre>
      <code class="html">[ &lt;li&gt;Glen&lt;/li&gt; ]
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4611749" d:title="CSS/outerHeight(margin)">
    <d:index d:value="outerHeight" d:title="CSS/outerHeight(margin)"/>
    <p class="title">CSS/outerHeight(margin)</p>
    <p>
					Gets the outer height (includes the border and padding by default) for the first matched element.
				</p>
    <p>
					 This method works for both visible and hidden elements. It is not supported for elements that are indirectly hidden by consequence of a parent being hidden. Please use .height() for the window and document.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>margin (<span class="arg-type" title="true or false.">Boolean</span>)</span>
    						- 
						When set to true the margin of the element will be included in the calculations.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Get outerHeight
					</p>
    <pre>
      <code class="javascript">var p = $("p:first");
$("p:last").text( "outerHeight:" + p.outerHeight() + " , outerHeight(true):" + p.outerHeight(true) );

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;Hello&lt;/p&gt;&lt;p&gt;&lt;/p&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4611806" d:title="CSS/outerWidth(margin)">
    <d:index d:value="outerWidth" d:title="CSS/outerWidth(margin)"/>
    <p class="title">CSS/outerWidth(margin)</p>
    <p>
					Get the outer width (includes the border and padding by default) for the first matched element.
				</p>
    <p>
					This method works for both visible and hidden elements. It is not supported for elements that are indirectly hidden by consequence of a parent being hidden. Please use .width() for the window and document.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>margin (<span class="arg-type" title="true or false.">Boolean</span>)</span>
    						- 
						When set to true the margin of the element will be included in the calculations.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Get outerWidth
					</p>
    <pre>
      <code class="javascript">var p = $("p:first");
$("p:last").text( "outerWidth:" + p.outerWidth()+ " , outerWidth(true):" + p.outerWidth(true) );

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;Hello&lt;/p&gt;&lt;p&gt;&lt;/p&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4604190" d:title="Selectors/parent()">
    <d:index d:value="parent" d:title="Selectors/parent()"/>
    <p class="title">Selectors/parent()</p>
    <p>
					Matches all elements that are parents - they have child elements, including text.
				</p>
    <p>
					
				</p>
    <h2>Example:</h2>
    <p>
						Finds all tds with children, including text.
					</p>
    <pre>
      <code class="javascript">$("td:parent").fadeTo(1500, 0.3);
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;table border="1"&gt;
    &lt;tr&gt;&lt;td&gt;Value 1&lt;/td&gt;&lt;td&gt;&lt;/td&gt;&lt;/tr&gt;
    &lt;tr&gt;&lt;td&gt;Value 2&lt;/td&gt;&lt;td&gt;&lt;/td&gt;&lt;/tr&gt;
  &lt;/table&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4608356" d:title="Traversing/parent(expr)">
    <d:index d:value="parent" d:title="Traversing/parent(expr)"/>
    <p class="title">Traversing/parent(expr)</p>
    <p>
					Get the direct parent of an element. If called on a set of elements, parent returns a set of their unique direct parent elements.
				</p>
    <p>
					You may use an optional expression to filter the element(s).  If there is no parent, returns a jQuery object with a length of 0.<br xmlns=""/><br xmlns=""/>
To get or query all ancestor elements, consider closest or parents.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>expr (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						An expression to filter the parent with.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Shows the parent of each element as (parent &gt; child).  Check the View Source to see the raw html.
					</p>
    <pre>
      <code class="javascript">$("*", document.body).each(function () {
      var parentTag = $(this).parent().get(0).tagName;
      $(this).prepend(document.createTextNode(parentTag + " &gt; "));
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div&gt;div, 
    &lt;span&gt;span, &lt;/span&gt;
    &lt;b&gt;b &lt;/b&gt;
  &lt;/div&gt;
  &lt;p&gt;p, 
    &lt;span&gt;span, 
      &lt;em&gt;em &lt;/em&gt;
    &lt;/span&gt;
  &lt;/p&gt;
  &lt;div&gt;div, 
    &lt;strong&gt;strong, 
      &lt;span&gt;span, &lt;/span&gt;
      &lt;em&gt;em, 
        &lt;b&gt;b, &lt;/b&gt;
      &lt;/em&gt;
    &lt;/strong&gt;
    &lt;b&gt;b &lt;/b&gt;
  &lt;/div&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Find the parent element of each paragraph with a class "selected".
					</p>
    <pre>
      <code class="javascript">$("p").parent(".selected").css("background", "yellow");
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div&gt;&lt;p&gt;Hello&lt;/p&gt;&lt;/div&gt;
  &lt;div class="selected"&gt;&lt;p&gt;Hello Again&lt;/p&gt;&lt;/div&gt;

					</code>
    </pre>
  </d:entry>
  <d:entry id="id4608443" d:title="Traversing/parents(expr)">
    <d:index d:value="parents" d:title="Traversing/parents(expr)"/>
    <p class="title">Traversing/parents(expr)</p>
    <p>
					Get a set of elements containing the unique ancestors of the matched set of elements (except for the root element).
				</p>
    <p>
					The matched elements can be filtered with an optional expression. 
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>expr (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						An expression to filter the ancestors with
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Find all parent elements of each b.
					</p>
    <pre>
      <code class="javascript">var parentEls = $("b").parents()
                          .map(function () { 
                                return this.tagName; 
                              })
                          .get().join(", ");
    $("b").append("&lt;strong&gt;" + parentEls + "&lt;/strong&gt;");

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div&gt;
    &lt;p&gt;
      &lt;span&gt;
        &lt;b&gt;My parents are: &lt;/b&gt;
      &lt;/span&gt;
    &lt;/p&gt;
  &lt;/div&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Click to find all unique div parent elements of each span.
					</p>
    <pre>
      <code class="javascript">function showParents() {
      $("div").css("border-color", "white");
      var len = $("span.selected")
                       .parents("div")
                       .css("border", "2px red solid")
                       .length;
      $("b").text("Unique div parents: " + len);
    }
    $("span").click(function () {
      $(this).toggleClass("selected");
      showParents();
    });
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;
    &lt;div&gt;
      &lt;div&gt;&lt;span&gt;Hello&lt;/span&gt;&lt;/div&gt;
      &lt;span&gt;Hello Again&lt;/span&gt;
    &lt;/div&gt;
    &lt;div&gt;
      &lt;span&gt;And Hello Again&lt;/span&gt;
    &lt;/div&gt;
  &lt;/p&gt;
  &lt;b&gt;Click Hellos to toggle their parents.&lt;/b&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4605280" d:title="Selectors/password()">
    <d:index d:value="password" d:title="Selectors/password()"/>
    <p class="title">Selectors/password()</p>
    <p>
					Matches all input elements of type password.
				</p>
    <p>
					
				</p>
    <h2>Example:</h2>
    <p>
						Finds all password inputs.
					</p>
    <pre>
      <code class="javascript">var input = $("input:password").css({background:"yellow", border:"3px red solid"});
    $("div").text("For this type jQuery found " + input.length + ".")
            .css("color", "red");
    $("form").submit(function () { return false; }); // so it won't submit

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;form&gt;
    &lt;input type="button" value="Input Button"/&gt;
    &lt;input type="checkbox" /&gt;
    &lt;input type="file" /&gt;
    &lt;input type="hidden" /&gt;
    &lt;input type="image" /&gt;
    &lt;input type="password" /&gt;
    &lt;input type="radio" /&gt;
    &lt;input type="reset" /&gt;
    &lt;input type="submit" /&gt;
    &lt;input type="text" /&gt;
    &lt;select&gt;&lt;option&gt;Option&lt;option/&gt;&lt;/select&gt;
    &lt;textarea&gt;&lt;/textarea&gt;
    &lt;button&gt;Button&lt;/button&gt;
  &lt;/form&gt;
  &lt;div&gt;
  &lt;/div&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4611178" d:title="CSS/position()">
    <d:index d:value="position" d:title="CSS/position()"/>
    <p class="title">CSS/position()</p>
    <p>
					Gets the top and left position of an element relative to its offset parent. 
				</p>
    <p>
					The returned object contains two 
&lt;a href='Types#Integer'&gt;Integer&lt;/a&gt;					 properties, top and left. For accurate calculations make sure to use pixel values for margins, borders and padding. This method only works with visible elements. 
				</p>
    <h2>Example:</h2>
    <p>
						Access the position of the second paragraph:
					</p>
    <pre>
      <code class="javascript">var p = $("p:first");
var position = p.position();
$("p:last").text( "left: " + position.left + ", top: " + position.top );
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div&gt;&lt;p&gt;Hello&lt;/p&gt;&lt;/div&gt;&lt;p&gt;&lt;/p&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4609376" d:title="Manipulation/prepend(content)">
    <d:index d:value="prepend" d:title="Manipulation/prepend(content)"/>
    <p class="title">Manipulation/prepend(content)</p>
    <p>
					Prepend content to the inside of every matched element.
				</p>
    <p>
					This operation is the best way to insert elements inside, at the beginning, of all matched elements.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>content (<span class="arg-type" title="">String, Element, jQuery</span>)</span>
    						- 
						Content to prepend to the target.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Prepends some HTML to all paragraphs.
					</p>
    <pre>
      <code class="javascript">$("p").prepend("&lt;b&gt;Hello &lt;/b&gt;");
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;there friend!&lt;/p&gt;
  &lt;p&gt;amigo!&lt;/p&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Prepends a DOM Element to all paragraphs.
					</p>
    <pre>
      <code class="javascript">$("p").prepend(document.createTextNode("Hello "));
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;is what I'd say&lt;/p&gt;
  &lt;p&gt;is what I said&lt;/p&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Prepends a jQuery object (similar to an Array of DOM Elements) to all paragraphs.
					</p>
    <pre>
      <code class="javascript">$("p").prepend( $("b") );
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt; is what was said.&lt;/p&gt;&lt;b&gt;Hello&lt;/b&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4609472" d:title="Manipulation/prependTo(selector)">
    <d:index d:value="prependTo" d:title="Manipulation/prependTo(selector)"/>
    <p class="title">Manipulation/prependTo(selector)</p>
    <p>
					Prepend all of the matched elements to another, specified, set of elements. As of jQuery 1.3.2, returns all of the inserted elements.
				</p>
    <p>
					This operation is, essentially, the reverse of doing a regular $(A).prepend(B), in that instead of prepending B to A, you're prepending A to B.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>selector (<span class="arg-type" title="">Selector</span>)</span>
    						- 
						target to which the content will be prepended.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Prepends all spans to the element with the ID "foo"
					</p>
    <pre>
      <code class="javascript">$("span").prependTo("#foo"); // check prepend() examples
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div id="foo"&gt;FOO!&lt;/div&gt;
  &lt;span&gt;I have something to say... &lt;/span&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4608549" d:title="Traversing/prev(expr)">
    <d:index d:value="prev" d:title="Traversing/prev(expr)"/>
    <p class="title">Traversing/prev(expr)</p>
    <p>
					Get a set of elements containing the unique previous siblings of each of the matched set of elements.
				</p>
    <p>
					Use an optional expression to filter the matched set.<br xmlns=""/><br xmlns=""/>Only the immediately previous sibling is returned, not all previous siblings. 
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>expr (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						An expression to filter the previous Elements with.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Find the very previous sibling of each div.
					</p>
    <pre>
      <code class="javascript">var $curr = $("#start");
    $curr.css("background", "#f99");
    $("button").click(function () {
      $curr = $curr.prev();
      $("div").css("background", "");
      $curr.css("background", "#f99");
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div&gt;&lt;/div&gt;
  &lt;div&gt;&lt;/div&gt;
  &lt;div&gt;&lt;span&gt;has child&lt;/span&gt;&lt;/div&gt;
  &lt;div&gt;&lt;/div&gt;
  &lt;div&gt;&lt;/div&gt;
  &lt;div&gt;&lt;/div&gt;
  &lt;div id="start"&gt;&lt;/div&gt;
  &lt;div&gt;&lt;/div&gt;
  &lt;p&gt;&lt;button&gt;Go to Prev&lt;/button&gt;&lt;/p&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Find the very previous sibling of each paragraph that has a class "selected".
					</p>
    <pre>
      <code class="javascript">$("p").prev(".selected").css("background", "yellow");
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div&gt;&lt;span&gt;Hello&lt;/span&gt;&lt;/div&gt;
  &lt;p class="selected"&gt;Hello Again&lt;/p&gt;
  &lt;p&gt;And Again&lt;/p&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4608636" d:title="Traversing/prevAll(expr)">
    <d:index d:value="prevAll" d:title="Traversing/prevAll(expr)"/>
    <p class="title">Traversing/prevAll(expr)</p>
    <p>
					Find all sibling elements in front of the current element.
				</p>
    <p>
					Use an optional expression to filter the matched set. 
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>expr (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						An expression to filter the previous elements with.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Locate all the divs in front of the last div and give them a class.
					</p>
    <pre>
      <code class="javascript">$("div:last").prevAll().addClass("before");
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div&gt;&lt;/div&gt;
  &lt;div&gt;&lt;/div&gt;
  &lt;div&gt;&lt;/div&gt;
  &lt;div&gt;&lt;/div&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4602125" d:title="Core/queue(name)">
    <d:index d:value="queue" d:title="Core/queue(name)"/>
    <p class="title">Core/queue(name)</p>
    <p>
					Returns a reference to the first element's queue (which is an array of functions).
				</p>
    <p>
					
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>name (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						The queue name (fx by default)
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Show the length of the queue.
					</p>
    <pre>
      <code class="javascript">$("#show").click(function () {
      var n = $("div").queue("fx");
      $("span").text("Queue length is: " + n.length);
    });
    function runIt() {
      $("div").show("slow");
      $("div").animate({left:'+=200'},2000);
      $("div").slideToggle(1000);
      $("div").slideToggle("fast");
      $("div").animate({left:'-=200'},1500);
      $("div").hide("slow");
      $("div").show(1200);
      $("div").slideUp("normal", runIt);
    }
    runIt();

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;button id="show"&gt;Show Length of Queue&lt;/button&gt;
  &lt;span&gt;&lt;/span&gt;
  &lt;div&gt;&lt;/div&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4602190" d:title="Core/queue(name, callback)">
    <d:index d:value="queue" d:title="Core/queue(name, callback)"/>
    <p class="title">Core/queue(name, callback)</p>
    <p>
					Adds a new function, to be executed, onto the end of the queue of all matched elements.
				</p>
    <p>
					
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>name (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						The queue name (fx by default)
					</li>
        <li><span>callback (<span class="arg-type" title="A reference to a Javascript function.">Function</span>)</span>
    						- 
						The function to add to the queue.
&lt;pre&gt;function callback() {
  this; // dom element
  // to continue the queue you must call
  jQuery(this).dequeue();
}
&lt;/pre&gt;
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Queue a custom function.
					</p>
    <pre>
      <code class="javascript">$(document.body).click(function () {
      $("div").show("slow");
      $("div").animate({left:'+=200'},2000);
      $("div").queue(function () {
        $(this).addClass("newcolor");
        $(this).dequeue();
      });
      $("div").animate({left:'-=200'},500);
      $("div").queue(function () {
        $(this).removeClass("newcolor");
        $(this).dequeue();
      });
      $("div").slideUp();
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  Click here...
  &lt;div&gt;&lt;/div&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4602269" d:title="Core/queue(name, queue)">
    <d:index d:value="queue" d:title="Core/queue(name, queue)"/>
    <p class="title">Core/queue(name, queue)</p>
    <p>
					Replaces the queue of all matched element with this new queue (the array of functions).
				</p>
    <p>
					
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>name (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						The queue name (fx by default)
					</li>
        <li><span>queue (<span class="arg-type" title="">Array&lt;Function&gt;</span>)</span>
    						- 
						The queue to replace all the queues with.  The functions have the same parameters and this value as queue(callback).
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Set a queue array to delete the queue.
					</p>
    <pre>
      <code class="javascript">$("#start").click(function () {
      $("div").show("slow");
      $("div").animate({left:'+=200'},5000);
      $("div").queue(function () {
        $(this).addClass("newcolor");
        $(this).dequeue();
      });
      $("div").animate({left:'-=200'},1500);
      $("div").queue(function () {
        $(this).removeClass("newcolor");
        $(this).dequeue();
      });
      $("div").slideUp();
    });
    $("#stop").click(function () {
      $("div").queue("fx", []);
      $("div").stop();
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;button id="start"&gt;Start&lt;/button&gt;
  &lt;button id="stop"&gt;Stop&lt;/button&gt;
  &lt;div&gt;&lt;/div&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4605329" d:title="Selectors/radio()">
    <d:index d:value="radio" d:title="Selectors/radio()"/>
    <p class="title">Selectors/radio()</p>
    <p>
					Matches all input elements of type radio.
				</p>
    <p>
					Using this pseudo-selector like &lt;code&gt;$(':radio')&lt;/code&gt; is equivalent to &lt;code&gt;$('*:radio')&lt;/code&gt; which is a slow selector. It's recommended to do &lt;code&gt;$('input:radio')&lt;/code&gt;.<br xmlns=""/><br xmlns=""/>
To select a set of associated radio buttons, you might use: &lt;code&gt;$('input[name=gender]:radio')&lt;/code&gt;
				</p>
    <h2>Example:</h2>
    <p>
						Finds all radio inputs.
					</p>
    <pre>
      <code class="javascript">var input = $("form input:radio").wrap('&lt;span&gt;&lt;/span&gt;').parent().css({background:"yellow", border:"3px red solid"});
    $("div").text("For this type jQuery found " + input.length + ".")
            .css("color", "red");
    $("form").submit(function () { return false; }); // so it won't submit

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;form&gt;
    &lt;input type="button" value="Input Button"/&gt;
    &lt;input type="checkbox" /&gt;
    &lt;input type="file" /&gt;
    &lt;input type="hidden" /&gt;
    &lt;input type="image" /&gt;
    &lt;input type="password" /&gt;
    &lt;input type="radio" name="asdf" /&gt;
    &lt;input type="radio" name="asdf" /&gt;
    &lt;input type="reset" /&gt;
    &lt;input type="submit" /&gt;
    &lt;input type="text" /&gt;
    &lt;select&gt;&lt;option&gt;Option&lt;option/&gt;&lt;/select&gt;
    &lt;textarea&gt;&lt;/textarea&gt;
    &lt;button&gt;Button&lt;/button&gt;
  &lt;/form&gt;
  &lt;div&gt;
  &lt;/div&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4611874" d:title="Events/ready(fn)">
    <d:index d:value="ready" d:title="Events/ready(fn)"/>
    <p class="title">Events/ready(fn)</p>
    <p>
					Binds a function to be executed whenever the DOM is ready to be traversed and manipulated.
				</p>
    <p>
					&lt;p&gt;This is probably the most important function included in the event module, as it can greatly improve the response times of your web applications.&lt;/p&gt;&lt;p&gt;In a nutshell, this is a solid replacement for using window.onload, and attaching a function to that. By using this method, your bound function will be called the instant the DOM is ready to be read and manipulated, which is when 99.99% of all JavaScript code needs to run.&lt;/p&gt;&lt;p&gt;There is one argument passed to the ready event handler: A reference to the jQuery function. You can name that argument whatever you like, and can therefore stick with the $ alias without risk of naming collisions.&lt;/p&gt;&lt;p&gt;You can have as many $(document).ready events on your page as you like. The functions are then executed in the order they were added.&lt;/p&gt;
&lt;p&gt;'''Note:''' Please make sure that all stylesheets are included before your scripts (especially those that call the ready function). Doing so will make sure that all element properties are correctly defined before jQuery code begins executing. Failure to do this will cause sporadic problems, especially on WebKit-based browsers such as Safari.&lt;/p&gt;
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>fn (<span class="arg-type" title="A reference to a Javascript function.">Function</span>)</span>
    						- 
						The function to be executed when the DOM is ready.
&lt;pre&gt;function callback(jQueryReference) {
  this; // document
}
&lt;/pre&gt;
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Display a message when the DOM is loaded.
					</p>
    <pre>
      <code class="javascript">$(document).ready(function () {
    $("p").text("The DOM is now loaded and can be manipulated.");
});
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;
  &lt;/p&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						To run code when the DOM loads, write:
					</p>
    <pre>
      <code class="javascript">$(document).ready(function(){
  // Your code here...
});
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						To use both the shortcut for $(document).ready() and the argument to write failsafe jQuery code using the $ alias, without relying on the global alias, write:
					</p>
    <pre>
      <code class="javascript">jQuery(function($) {
  // Your code using failsafe $ alias here...
});
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Commonly written as:
					</p>
    <pre>
      <code class="javascript">$(function() {
  // Your code here...
});
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4610605" d:title="Manipulation/remove(expr)">
    <d:index d:value="remove" d:title="Manipulation/remove(expr)"/>
    <p class="title">Manipulation/remove(expr)</p>
    <p>
					Removes all matched elements from the DOM. 
				</p>
    <p>
					This does NOT remove them from the jQuery object, allowing you to use the matched elements further.  Note that this function starting with 1.2.2 will also remove all event handlers and internally cached data.  So:<br xmlns=""/><br xmlns=""/>&lt;code&gt;
$("#foo").remove().appendTo("#bar");
&lt;/code&gt;<br xmlns=""/><br xmlns=""/>should be written as<br xmlns=""/><br xmlns=""/>&lt;code&gt;
$("#foo").appendTo("#bar");
&lt;/code&gt;<br xmlns=""/><br xmlns=""/>to avoid losing the event handlers.<br xmlns=""/><br xmlns=""/>Can be filtered with an optional expression.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>expr (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						A jQuery expression to filter the set of elements to be removed.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Removes all paragraphs from the DOM
					</p>
    <pre>
      <code class="javascript">$("button").click(function () {
      $("p").remove();
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;Hello&lt;/p&gt; 
  how are 
  &lt;p&gt;you?&lt;/p&gt;
  &lt;button&gt;Call remove() on paragraphs&lt;/button&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Removes all paragraphs that contain "Hello" from the DOM
					</p>
    <pre>
      <code class="javascript">$("button").click(function () {
      $("p").remove(":contains('Hello')");
    });


					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p class="hello"&gt;Hello&lt;/p&gt;
  how are 
  &lt;p&gt;you?&lt;/p&gt;
  &lt;button&gt;Call remove(":contains('Hello')") on paragraphs&lt;/button&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4606148" d:title="Attributes/removeAttr(name)">
    <d:index d:value="removeAttr" d:title="Attributes/removeAttr(name)"/>
    <p class="title">Attributes/removeAttr(name)</p>
    <p>
					Remove an attribute from each of the matched elements.
				</p>
    <p>
					
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>name (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						The name of the property to remove.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Clicking the button enables the input next to it.
					</p>
    <pre>
      <code class="javascript">$("button").click(function () {
      $(this).next().removeAttr("disabled")
             .focus()
             .val("editable now");
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;button&gt;Enable&lt;/button&gt;
  &lt;input type="text" disabled="disabled" value="can't edit this" /&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4606333" d:title="Attributes/removeClass(class)">
    <d:index d:value="removeClass" d:title="Attributes/removeClass(class)"/>
    <p class="title">Attributes/removeClass(class)</p>
    <p>
					Removes all or the specified class(es) from the set of matched elements.
				</p>
    <p>
					
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>class (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						One or more CSS classes to remove from the elements, these are separated by spaces.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Remove the class 'blue' from the matched elements.
					</p>
    <pre>
      <code class="javascript">$("p:even").removeClass("blue");
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p class="blue under"&gt;Hello&lt;/p&gt;
  &lt;p class="blue under highlight"&gt;and&lt;/p&gt;
  &lt;p class="blue under"&gt;then&lt;/p&gt;
  &lt;p class="blue under"&gt;Goodbye&lt;/p&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Remove the class 'blue' and 'under' from the matched elements.
					</p>
    <pre>
      <code class="javascript">$("p:odd").removeClass("blue under");
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p class="blue under"&gt;Hello&lt;/p&gt;
  &lt;p class="blue under highlight"&gt;and&lt;/p&gt;
  &lt;p class="blue under"&gt;then&lt;/p&gt;
  &lt;p class="blue under"&gt;Goodbye&lt;/p&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Remove all the classes from the matched elements.
					</p>
    <pre>
      <code class="javascript">$("p:eq(1)").removeClass();
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p class="blue under"&gt;Hello&lt;/p&gt;
  &lt;p class="blue under highlight"&gt;and&lt;/p&gt;
  &lt;p class="blue under"&gt;then&lt;/p&gt;
  &lt;p class="blue under"&gt;Goodbye&lt;/p&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4602065" d:title="Core/removeData(name)">
    <d:index d:value="removeData" d:title="Core/removeData(name)"/>
    <p class="title">Core/removeData(name)</p>
    <p>
					Removes named data store from an element.
				</p>
    <p>
					This is the complement function to $(...).data(name, value).
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>name (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						The name of the data store property to remove.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Set a data store for 2 names then remove one of them.
					</p>
    <pre>
      <code class="javascript">$("span:eq(0)").text("" + $("div").data("test1"));
    $("div").data("test1", "VALUE-1");
    $("div").data("test2", "VALUE-2");
    $("span:eq(1)").text("" + $("div").data("test1"));
    $("div").removeData("test1");
    $("span:eq(2)").text("" + $("div").data("test1"));
    $("span:eq(3)").text("" + $("div").data("test2"));

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div&gt;value1 before creation: &lt;span&gt;&lt;/span&gt;&lt;/div&gt;
  &lt;div&gt;value1 after creation: &lt;span&gt;&lt;/span&gt;&lt;/div&gt;
  &lt;div&gt;value1 after removal: &lt;span&gt;&lt;/span&gt;&lt;/div&gt;
  &lt;div&gt;value2 after removal: &lt;span&gt;&lt;/span&gt;&lt;/div&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4610497" d:title="Manipulation/replaceAll(selector)">
    <d:index d:value="replaceAll" d:title="Manipulation/replaceAll(selector)"/>
    <p class="title">Manipulation/replaceAll(selector)</p>
    <p>
					Replaces the elements matched by the specified selector with the matched elements. As of jQuery 1.3.2, returns all of the inserted elements.
				</p>
    <p>
					This function is the complement to replaceWith() which does the same task with the parameters reversed.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>selector (<span class="arg-type" title="">Selector</span>)</span>
    						- 
						The elements to find and replace the matched elements with.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Replace all the paragraphs with bold words.
					</p>
    <pre>
      <code class="javascript">$("&lt;b&gt;Paragraph. &lt;/b&gt;").replaceAll("p"); // check replaceWith() examples
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;Hello&lt;/p&gt;
  &lt;p&gt;cruel&lt;/p&gt;
  &lt;p&gt;World&lt;/p&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4610373" d:title="Manipulation/replaceWith(content)">
    <d:index d:value="replaceWith" d:title="Manipulation/replaceWith(content)"/>
    <p class="title">Manipulation/replaceWith(content)</p>
    <p>
					Replaces all matched elements with the specified HTML or DOM elements.  This returns the JQuery element that was just replaced, which has been removed from the DOM.
				</p>
    <p>
					
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>content (<span class="arg-type" title="">String, Element, jQuery</span>)</span>
    						- 
						Content to replace the matched elements with.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						On click, replace the button with a div containing the same word.
					</p>
    <pre>
      <code class="javascript">$("button").click(function () {
      $(this).replaceWith("&lt;div&gt;" + $(this).text() + "&lt;/div&gt;");
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;button&gt;First&lt;/button&gt;
  &lt;button&gt;Second&lt;/button&gt;
  &lt;button&gt;Third&lt;/button&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Replace all the paragraphs with bold words.
					</p>
    <pre>
      <code class="javascript">$("p").replaceWith("&lt;b&gt;Paragraph. &lt;/b&gt;");
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;Hello&lt;/p&gt;
  &lt;p&gt;cruel&lt;/p&gt;
  &lt;p&gt;World&lt;/p&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Replace all the paragraphs with empty div elements.
					</p>
    <pre>
      <code class="javascript">$("p").replaceWith(document.createElement("div"));
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;Hello&lt;/p&gt;
  &lt;p&gt;cruel&lt;/p&gt;
  &lt;p&gt;World&lt;/p&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						On click, replace each paragraph with a jQuery div object that is already in the DOM.  Notice it doesn't clone the object but rather moves it to replace the paragraph.
					</p>
    <pre>
      <code class="javascript">$("p").click(function () {
      $(this).replaceWith($("div"));
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;Hello&lt;/p&gt;
  &lt;p&gt;cruel&lt;/p&gt;
  &lt;p&gt;World&lt;/p&gt;
  &lt;div&gt;Replaced!&lt;/div&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4605517" d:title="Selectors/reset()">
    <d:index d:value="reset" d:title="Selectors/reset()"/>
    <p class="title">Selectors/reset()</p>
    <p>
					Matches all input elements of type reset.
				</p>
    <p>
					
				</p>
    <h2>Example:</h2>
    <p>
						Finds all reset inputs.
					</p>
    <pre>
      <code class="javascript">var input = $(":reset").css({background:"yellow", border:"3px red solid"});
    $("div").text("For this type jQuery found " + input.length + ".")
            .css("color", "red");
    $("form").submit(function () { return false; }); // so it won't submit

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;form&gt;
    &lt;input type="button" value="Input Button"/&gt;
    &lt;input type="checkbox" /&gt;
    &lt;input type="file" /&gt;
    &lt;input type="hidden" /&gt;
    &lt;input type="image" /&gt;
    &lt;input type="password" /&gt;
    &lt;input type="radio" /&gt;
    &lt;input type="reset" /&gt;
    &lt;input type="submit" /&gt;
    &lt;input type="text" /&gt;
    &lt;select&gt;&lt;option&gt;Option&lt;option/&gt;&lt;/select&gt;
    &lt;textarea&gt;&lt;/textarea&gt;
    &lt;button&gt;Button&lt;/button&gt;
  &lt;/form&gt;
  &lt;div&gt;
  &lt;/div&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4667233" d:title="Events/resize(fn)">
    <d:index d:value="resize" d:title="Events/resize(fn)"/>
    <p class="title">Events/resize(fn)</p>
    <p>
					Bind a function to the resize event of each matched element.
				</p>
    <p>
					The resize event fires when a document view is resized
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>fn (<span class="arg-type" title="A reference to a Javascript function.">Function</span>)</span>
    						- 
						A function to bind to the resize event on each of the matched elements.
&lt;pre&gt;function callback(eventObject) {
  this; // dom element
}
&lt;/pre&gt;
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						To make resizing the web page window a pain in the neck, try:
					</p>
    <pre>
      <code class="javascript">$(window).resize(function(){
  alert("Stop it!");
});
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4667278" d:title="Events/scroll(fn)">
    <d:index d:value="scroll" d:title="Events/scroll(fn)"/>
    <p class="title">Events/scroll(fn)</p>
    <p>
					Bind a function to the scroll event of each matched element.
				</p>
    <p>
					The scroll event fires when a document view is scrolled.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>fn (<span class="arg-type" title="A reference to a Javascript function.">Function</span>)</span>
    						- 
						A function to bind to the scroll event on each of the matched elements.
&lt;pre&gt;function callback(eventObject) {
  this; // dom element
}
&lt;/pre&gt;
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						To do something when your page is scrolled:
					</p>
    <pre>
      <code class="javascript">$("p").clone().appendTo(document.body);
    $("p").clone().appendTo(document.body);
    $("p").clone().appendTo(document.body);
    $(window).scroll(function () { 
      $("span").css("display", "inline").fadeOut("slow"); 
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div&gt;Try scrolling the iframe.&lt;/div&gt;
  &lt;p&gt;Paragraph - &lt;span&gt;Scroll happened!&lt;/span&gt;&lt;/p&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4611325" d:title="CSS/scrollLeft()">
    <d:index d:value="scrollLeft" d:title="CSS/scrollLeft()"/>
    <p class="title">CSS/scrollLeft()</p>
    <p>
					Gets the scroll left offset of the first matched element.
				</p>
    <p>
					 This method works for both visible and hidden elements.
				</p>
    <h2>Example:</h2>
    <p>
						Get scrollLeft
					</p>
    <pre>
      <code class="javascript">var p = $("p:first");
$("p:last").text( "scrollLeft:" + p.scrollLeft() );

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;Hello&lt;/p&gt;&lt;p&gt;&lt;/p&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4611365" d:title="CSS/scrollLeft(val)">
    <d:index d:value="scrollLeft" d:title="CSS/scrollLeft(val)"/>
    <p class="title">CSS/scrollLeft(val)</p>
    <p>
					When a value is passed in, the scroll left offset is set to that value on all matched elements.
				</p>
    <p>
					 This method works for both visible and hidden elements.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>val (<span class="arg-type" title="A valid numeric.">Number</span>)</span>
    						- 
						A positive number representing the desired scroll left offset.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Get scrollLeft
					</p>
    <pre>
      <code class="javascript">$("div.demo").scrollLeft(300);

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div class="demo"&gt;&lt;p&gt;Hello&lt;/p&gt;&lt;/div&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4611229" d:title="CSS/scrollTop()">
    <d:index d:value="scrollTop" d:title="CSS/scrollTop()"/>
    <p class="title">CSS/scrollTop()</p>
    <p>
					Gets the scroll top offset of the first matched element.
				</p>
    <p>
					 This method works for both visible and hidden elements.
				</p>
    <h2>Example:</h2>
    <p>
						Get scrollTop
					</p>
    <pre>
      <code class="javascript">var p = $("p:first");
$("p:last").text( "scrollTop:" + p.scrollTop() );

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;Hello&lt;/p&gt;&lt;p&gt;&lt;/p&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4611269" d:title="CSS/scrollTop(val)">
    <d:index d:value="scrollTop" d:title="CSS/scrollTop(val)"/>
    <p class="title">CSS/scrollTop(val)</p>
    <p>
					When a value is passed in, the scroll top offset is set to that value on all matched elements.
				</p>
    <p>
					 This method works for both visible and hidden elements.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>val (<span class="arg-type" title="A valid numeric.">Number</span>)</span>
    						- 
						A positive number representing the desired scroll top offset.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Get scrollTop
					</p>
    <pre>
      <code class="javascript">$("div.demo").scrollTop(300);

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div class="demo"&gt;&lt;h1&gt;lalala&lt;/h1&gt;&lt;p&gt;Hello&lt;/p&gt;&lt;/div&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4667339" d:title="Events/select()">
    <d:index d:value="select" d:title="Events/select()"/>
    <p class="title">Events/select()</p>
    <p>
					Trigger the select event of each matched element.
				</p>
    <p>
					This causes all of the functions that have been bound to that select event to be executed, and calls the browser's default select action on the matching element(s). This default action can be prevented by returning false from one of the functions bound to the select event.<br xmlns=""/><br xmlns=""/>Note: Do not confuse the "select" event with the "
&lt;a href='Events/change'&gt;change&lt;/a&gt;					" event, which is the one triggered when an html "select" element is having its selected option modified by the user.
				</p>
    <h2>Example:</h2>
    <p>
						To trigger the select event on all input elements, try:
					</p>
    <pre>
      <code class="javascript">$("input").select();
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4667380" d:title="Events/select(fn)">
    <d:index d:value="select" d:title="Events/select(fn)"/>
    <p class="title">Events/select(fn)</p>
    <p>
					Bind a function to the select event of each matched element.
				</p>
    <p>
					The select event fires when a user selects some text in a text field, including input and textarea.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>fn (<span class="arg-type" title="A reference to a Javascript function.">Function</span>)</span>
    						- 
						A function to bind to the select event on each of the matched elements.
&lt;pre&gt;function callback(eventObject) {
  this; // dom element
}
&lt;/pre&gt;
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						To do something when text in input boxes is selected:
					</p>
    <pre>
      <code class="javascript">$(":input").select( function () { 
      $("div").text("Something was selected").show().fadeOut(1000); 
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;
    Click and drag the mouse to select text in the inputs.
  &lt;/p&gt;
  &lt;input type="text" value="Some text" /&gt;
  &lt;input type="text" value="to test on" /&gt;
  &lt;div&gt;&lt;/div&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4605804" d:title="Selectors/selected()">
    <d:index d:value="selected" d:title="Selectors/selected()"/>
    <p class="title">Selectors/selected()</p>
    <p>
					Matches all elements that are selected.
				</p>
    <p>
					This does not include checkboxes or radio inputs; use :checked for that.
				</p>
    <h2>Example:</h2>
    <p>
						Attaches a change event to the select that gets the text for each selected option and writes them in the div.  It then triggers the event for the initial text draw.
					</p>
    <pre>
      <code class="javascript">$("select").change(function () {
          var str = "";
          $("select option:selected").each(function () {
                str += $(this).text() + " ";
              });
          $("div").text(str);
        })
        .trigger('change');

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;select name="garden" multiple="multiple"&gt;
    &lt;option&gt;Flowers&lt;/option&gt;
    &lt;option selected="selected"&gt;Shrubs&lt;/option&gt;
    &lt;option&gt;Trees&lt;/option&gt;
    &lt;option selected="selected"&gt;Bushes&lt;/option&gt;
    &lt;option&gt;Grass&lt;/option&gt;
    &lt;option&gt;Dirt&lt;/option&gt;
  &lt;/select&gt;
  &lt;div&gt;&lt;/div&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4601476" d:title="Core/selector">
    <d:index d:value="selector" d:title="Core/selector"/>
    <p class="title">Core/selector</p>
    <p>
					'''New in jQuery 1.3''' A selector representing selector originally passed to jQuery().
				</p>
    <p>
					&lt;p&gt;Should be used in conjunction with context to determine the exact query used. These two properties are mostly useful to plugin developers.&lt;/p&gt;
				</p>
    <h2>Example:</h2>
    <p>
						Determine the selector used.
					</p>
    <pre>
      <code class="javascript">$("ul")
  .append("&lt;li&gt;" + $("ul").selector + "&lt;/li&gt;")
  .append("&lt;li&gt;" + $("ul li").selector + "&lt;/li&gt;")
  .append("&lt;li&gt;" + $("div#foo ul:not([class])").selector + "&lt;/li&gt;");

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  Some selectors:&lt;ul&gt;&lt;/ul&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4671230" d:title="Ajax/serialize()">
    <d:index d:value="serialize" d:title="Ajax/serialize()"/>
    <p class="title">Ajax/serialize()</p>
    <p>
					Serializes a set of input elements into a string of data.
				</p>
    <p>
					Serialize is typically used to prepare user input data to be posted to a server.  The serialized data is in a standard format that is compatible with almost all server side programming languages and frameworks.<br xmlns=""/><br xmlns=""/>In order to work properly '''serialize requires that form fields have a name''' attribute.  Having only an id will not work.  Note the name attribute in this field:<br xmlns=""/><br xmlns=""/>
&lt;input id="email" name="email" type="text" /&gt;<br xmlns=""/><br xmlns=""/>
'''Versions'''<br xmlns=""/><br xmlns=""/>As of jQuery 1.2 the serialize method correctly serializes forms. <br xmlns=""/><br xmlns=""/>For older versions of jQuery, the [http://www.malsup.com/jquery/form/ Form Plugin's] fieldSerialize method should be used.
				</p>
    <h2>Example:</h2>
    <p>
						Serialize a form to a query string, that could be sent to a server in an Ajax request.
					</p>
    <pre>
      <code class="javascript">function showValues() {
      var str = $("form").serialize();
      $("#results").text(str);
    }
    $(":checkbox, :radio").click(showValues);
    $("select").change(showValues);
    showValues();

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;form&gt;
    &lt;select name="single"&gt;
      &lt;option&gt;Single&lt;/option&gt;
      &lt;option&gt;Single2&lt;/option&gt;
    &lt;/select&gt;
&lt;br /&gt;
    &lt;select name="multiple" multiple="multiple"&gt;
      &lt;option selected="selected"&gt;Multiple&lt;/option&gt;
      &lt;option&gt;Multiple2&lt;/option&gt;
      &lt;option selected="selected"&gt;Multiple3&lt;/option&gt;
    &lt;/select&gt;
&lt;br/&gt;
    &lt;input type="checkbox" name="check" value="check1" id="ch1"/&gt;
    &lt;label for="ch1"&gt;check1&lt;/label&gt;

    &lt;input type="checkbox" name="check" value="check2" checked="checked" id="ch2"/&gt;
    &lt;label for="ch2"&gt;check2&lt;/label&gt;
&lt;br /&gt;
    &lt;input type="radio" name="radio" value="radio1" checked="checked" id="r1"/&gt;
    &lt;label for="r1"&gt;radio1&lt;/label&gt;
    &lt;input type="radio" name="radio" value="radio2" id="r2"/&gt;
    &lt;label for="r2"&gt;radio2&lt;/label&gt;
  &lt;/form&gt;
  &lt;p&gt;&lt;tt id="results"&gt;&lt;/tt&gt;&lt;/p&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4671290" d:title="Ajax/serializeArray()">
    <d:index d:value="serializeArray" d:title="Ajax/serializeArray()"/>
    <p class="title">Ajax/serializeArray()</p>
    <p>
					Serializes all forms and form elements (like the 
&lt;a href='Ajax/serialize'&gt;.serialize()&lt;/a&gt;					 method) but returns a JSON data structure for you to work with.&lt;br /&gt;
'''Note:''' The JSON structure returned is not a string.  You must use a plugin or third-party library to "stringify".<br xmlns=""/><br xmlns=""/>				</p>
    <p>
					The returned JSON structure consists of an Array of Objects where each Object contains one or two keys: &lt;code&gt;name&lt;/code&gt; for the parameter name and &lt;code&gt;value&lt;/code&gt; for the parameter value if set/not empty.&lt;br /&gt;
Example:
&lt;code&gt;
   [ 
      {name: 'firstname', value: 'Hello'}, 
      {name: 'lastname', value: 'World'},
      {name: 'alias'}, // this one was empty
   ]
&lt;/code&gt;<br xmlns=""/><br xmlns=""/>Note that &lt;code&gt;serializeArray()&lt;/code&gt; only works on &lt;code&gt;form&lt;/code&gt; elements, using this method on another element will not work. Also, this method will not give any results on nested forms, which are illegal in HTML anyway.
				</p>
    <h2>Example:</h2>
    <p>
						Get the values from a form, iterate through them, and append them to a results display.
					</p>
    <pre>
      <code class="javascript">function showValues() {
      var fields = $(":input").serializeArray();
      $("#results").empty();
      jQuery.each(fields, function(i, field){
        $("#results").append(field.value + " ");
      });
    }

    $(":checkbox, :radio").click(showValues);
    $("select").change(showValues);
    showValues();

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;&lt;b&gt;Results:&lt;/b&gt; &lt;span id="results"&gt;&lt;/span&gt;&lt;/p&gt;
  &lt;form&gt;
    &lt;select name="single"&gt;
      &lt;option&gt;Single&lt;/option&gt;
      &lt;option&gt;Single2&lt;/option&gt;
    &lt;/select&gt;
    &lt;select name="multiple" multiple="multiple"&gt;
      &lt;option selected="selected"&gt;Multiple&lt;/option&gt;
      &lt;option&gt;Multiple2&lt;/option&gt;
      &lt;option selected="selected"&gt;Multiple3&lt;/option&gt;
    &lt;/select&gt;&lt;br/&gt;
    &lt;input type="checkbox" name="check" value="check1" id="ch1"/&gt;
    &lt;label for="ch1"&gt;check1&lt;/label&gt;
    &lt;input type="checkbox" name="check" value="check2" checked="checked" id="ch2"/&gt;
    &lt;label for="ch2"&gt;check2&lt;/label&gt;
    &lt;input type="radio" name="radio" value="radio1" checked="checked" id="r1"/&gt;
    &lt;label for="r1"&gt;radio1&lt;/label&gt;
    &lt;input type="radio" name="radio" value="radio2" id="r2"/&gt;
    &lt;label for="r2"&gt;radio2&lt;/label&gt;
  &lt;/form&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4667606" d:title="Effects/show()">
    <d:index d:value="show" d:title="Effects/show()"/>
    <p class="title">Effects/show()</p>
    <p>
					Displays each of the set of matched elements if they are hidden.
				</p>
    <p>
					Same as 
&lt;a href='Effects/show#speedcallback'&gt;show( speed, [callback] )&lt;/a&gt;					 without animations. Doesn't change anything if the selected elements are all visible. It doesn't matter if the element is hidden via a hide() call, or via a display:none in a stylesheet.
				</p>
    <h2>Example:</h2>
    <p>
						Shows all paragraphs.
					</p>
    <pre>
      <code class="javascript">$("p").show()
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p style="display:none"&gt;Hello 1&lt;/p&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4667651" d:title="Effects/show(speed, callback)">
    <d:index d:value="show" d:title="Effects/show(speed, callback)"/>
    <p class="title">Effects/show(speed, callback)</p>
    <p>
					Show all matched elements using a graceful animation and firing an optional callback after completion.
				</p>
    <p>
					&lt;p&gt;The height, width, and opacity of each of the matched elements are changed dynamically according to the specified speed. As of jQuery 1.3 the padding and margin are also animated, creating a smoother effect.&lt;/p&gt;
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>speed (<span class="arg-type" title="">String, Number </span>)</span>
    						- 
						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).
					</li>
        <li><span>callback (<span class="arg-type" title="A reference to a Javascript function.">Function</span>)</span>
    						- 
						A function to be executed whenever the animation completes; executes once for each element animated against.
&lt;pre&gt;function callback() {
  this; // dom element
}
&lt;/pre&gt;
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Animates all hidden paragraphs to show slowly, completing the animation within 600 milliseconds.
					</p>
    <pre>
      <code class="javascript">$("button").click(function () {
      $("p").show("slow");
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;button&gt;Show it&lt;/button&gt;
  &lt;p style="display: none"&gt;Hello  2&lt;/p&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Animates all hidden divs to show fastly in order, completing each animation within 200 milliseconds. Once each animation is done, it starts the next one.
					</p>
    <pre>
      <code class="javascript">$("#showr").click(function () {
      $("div:eq(0)").show("fast", function () {
        // use callee so don't have to name the function
        $(this).next().show("fast", arguments.callee); 
      });
    });
    $("#hidr").click(function () {
      $("div").hide(2000);
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;button id="showr"&gt;Show&lt;/button&gt;
  &lt;button id="hidr"&gt;Hide&lt;/button&gt;
  &lt;div&gt;Hello 3,&lt;/div&gt;
  &lt;div&gt;how&lt;/div&gt;
  &lt;div&gt;are&lt;/div&gt;
  &lt;div&gt;you?&lt;/div&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Animates all span and input elements to show normally. Once the animation is done, it changes the text.
					</p>
    <pre>
      <code class="javascript">function doIt() {
      $("span,div").show("normal");
    }
    $("button").click(doIt); // can pass in function name
    $("form").submit(function () {
      if ($("input").val() == "yes") {
        $("p").show(4000, function () {
          $(this).text("Ok, DONE! (now showing)");
        });
      }
      $("span,div").hide("normal");
      return false; // to stop the submit
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;button&gt;Do it!&lt;/button&gt;
  &lt;span&gt;Are you sure? (type 'yes' if you are) &lt;/span&gt;
  &lt;div&gt;
    &lt;form&gt;
      &lt;input type="text"  value="as;ldkfjalsdf"/&gt;
    &lt;/form&gt;
  &lt;/div&gt;
  &lt;p style="display:none;"&gt;I'm hidden...&lt;/p&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4608695" d:title="Traversing/siblings(expr)">
    <d:index d:value="siblings" d:title="Traversing/siblings(expr)"/>
    <p class="title">Traversing/siblings(expr)</p>
    <p>
					Get a set of elements containing all of the unique siblings of each of the matched set of elements.
				</p>
    <p>
					Can be filtered with an optional expression. 
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>expr (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						An expression to filter the sibling Elements with
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Find the unique siblings of all yellow li elements in the 3 lists (including other yellow li elements if appropriate).
					</p>
    <pre>
      <code class="javascript">var len = $(".hilite").siblings()
                          .css("color", "red")
                          .length;
    $("b").text(len);

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;ul&gt;
    &lt;li&gt;One&lt;/li&gt;
    &lt;li&gt;Two&lt;/li&gt;
    &lt;li class="hilite"&gt;Three&lt;/li&gt;
    &lt;li&gt;Four&lt;/li&gt;
  &lt;/ul&gt;
  &lt;ul&gt;
    &lt;li&gt;Five&lt;/li&gt;
    &lt;li&gt;Six&lt;/li&gt;
    &lt;li&gt;Seven&lt;/li&gt;
  &lt;/ul&gt;
  &lt;ul&gt;
    &lt;li&gt;Eight&lt;/li&gt;
    &lt;li class="hilite"&gt;Nine&lt;/li&gt;
    &lt;li&gt;Ten&lt;/li&gt;
    &lt;li class="hilite"&gt;Eleven&lt;/li&gt;
  &lt;/ul&gt;
  &lt;p&gt;Unique siblings: &lt;b&gt;&lt;/b&gt;&lt;/p&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Find all siblings with a class "selected" of each div.
					</p>
    <pre>
      <code class="javascript">$("p").siblings(".selected").css("background", "yellow");
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div&gt;&lt;span&gt;Hello&lt;/span&gt;&lt;/div&gt;
  &lt;p class="selected"&gt;Hello Again&lt;/p&gt;
  &lt;p&gt;And Again&lt;/p&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4603390" d:title="Selectors/siblings(prev, siblings)">
    <d:index d:value="siblings" d:title="Selectors/siblings(prev, siblings)"/>
    <p class="title">Selectors/siblings(prev, siblings)</p>
    <p>
					Matches all sibling elements after the "prev" element that match the filtering "siblings" selector.
				</p>
    <p>
					
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>prev (<span class="arg-type" title="">Selector</span>)</span>
    						- 
						Any valid selector.
					</li>
        <li><span>siblings (<span class="arg-type" title="">Selector</span>)</span>
    						- 
						A filter selector to match elements that are following siblings to the first selector.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Finds all divs that are siblings after the element with #prev as its id.  Notice the span isn't selected since it is not a div and the "niece" isn't selected since it is a child of a sibling, not an actual sibling.
					</p>
    <pre>
      <code class="javascript">$("#prev ~ div").css("border", "3px groove blue");
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div&gt;div (doesn't match since before #prev)&lt;/div&gt;
  &lt;span id="prev"&gt;span#prev&lt;/span&gt;
  &lt;div&gt;div sibling&lt;/div&gt;
  &lt;div&gt;div sibling &lt;div id="small"&gt;div niece&lt;/div&gt;&lt;/div&gt;
  &lt;span&gt;span sibling (not div)&lt;/span&gt;
  &lt;div&gt;div sibling&lt;/div&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4601388" d:title="Core/size()">
    <d:index d:value="size" d:title="Core/size()"/>
    <p class="title">Core/size()</p>
    <p>
					The number of elements in the jQuery object.
				</p>
    <p>
					This returns the same number as the '
&lt;a href='Core/length'&gt;length&lt;/a&gt;					' property <br xmlns=""/><br xmlns=""/>of the jQuery object. However, it is slightly slower, so length should be used instead.
				</p>
    <h2>Example:</h2>
    <p>
						Count the divs. Click to add more.
					</p>
    <pre>
      <code class="javascript">$(document.body).click(function () { $(document.body).append($("&lt;div&gt;"));
var n = $("div").size();
$("span").text("There are " + n + " divs." + "Click to add more.");}).click(); // trigger the click to start
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;span&gt;&lt;/span&gt;
 &lt;div&gt;&lt;/div&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4607559" d:title="Traversing/slice(start, end)">
    <d:index d:value="slice" d:title="Traversing/slice(start, end)"/>
    <p class="title">Traversing/slice(start, end)</p>
    <p>
					Selects a subset of the matched elements.
				</p>
    <p>
					Behaves exactly like the built-in [https://developer.mozilla.org/en/Core_JavaScript_1.5_Reference/Global_Objects/Array/slice Array slice method]. (Negative values are allowed)
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>start (<span class="arg-type" title="">Integer</span>)</span>
    						- 
						Where to start the subset. The first element is at zero. Can be negative to start from the end of the selection.
					</li>
        <li><span>end (<span class="arg-type" title="">Integer</span>)</span>
    						- 
						Where to end the subset (does not include the end element itself). If unspecified, ends at the end of the selection.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Turns divs yellow based on a random slice.
					</p>
    <pre>
      <code class="javascript">function colorEm() {
      var $div = $("div");
      var start = Math.floor(Math.random() *
                             $div.length);
      var end = Math.floor(Math.random() *
                           ($div.length - start)) +
                           start + 1;
      if (end == $div.length) end = undefined;
      $div.css("background", "");
      if (end) 
        $div.slice(start, end).css("background", "yellow");   
       else
        $div.slice(start).css("background", "yellow");
      
      $("span").text('$("div").slice(' + start +
                     (end ? ', ' + end : '') +
                     ').css("background", "yellow");');
    }

    $("button").click(colorEm);

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;button&gt;Turn slice yellow&lt;/button&gt;
  &lt;span&gt;Click the button!&lt;/span&gt;
  &lt;div&gt;&lt;/div&gt;
  &lt;div&gt;&lt;/div&gt;
  &lt;div&gt;&lt;/div&gt;
  &lt;div&gt;&lt;/div&gt;
  &lt;div&gt;&lt;/div&gt;
  &lt;div&gt;&lt;/div&gt;
  &lt;div&gt;&lt;/div&gt;
  &lt;div&gt;&lt;/div&gt;
  &lt;div&gt;&lt;/div&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Selects all paragraphs, then slices the selection to include only the first element.
					</p>
    <pre>
      <code class="javascript">$("p").slice(0, 1).wrapInner("&lt;b&gt;&lt;/b&gt;");
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Selects all paragraphs, then slices the selection to include only the first and second element.
					</p>
    <pre>
      <code class="javascript">$("p").slice(0, 2).wrapInner("&lt;b&gt;&lt;/b&gt;");
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Selects all paragraphs, then slices the selection to include only the second element.
					</p>
    <pre>
      <code class="javascript">$("p").slice(1, 2).wrapInner("&lt;b&gt;&lt;/b&gt;");
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Selects all paragraphs, then slices the selection to include only the second and third element.
					</p>
    <pre>
      <code class="javascript">$("p").slice(1).wrapInner("&lt;b&gt;&lt;/b&gt;");
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Selects all paragraphs, then slices the selection to include only the third element.
					</p>
    <pre>
      <code class="javascript">$("p").slice(-1).wrapInner("&lt;b&gt;&lt;/b&gt;");
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4668165" d:title="Effects/slideDown(speed, callback)">
    <d:index d:value="slideDown" d:title="Effects/slideDown(speed, callback)"/>
    <p class="title">Effects/slideDown(speed, callback)</p>
    <p>
					Reveal all matched elements by adjusting their height and firing an optional callback after completion.
				</p>
    <p>
					Only the height is adjusted for this animation, causing all matched elements to be revealed in a "sliding" manner. As of jQuery 1.3 the vertical padding and vertical margin are also animated, creating a smoother effect.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>speed (<span class="arg-type" title="">String, Number </span>)</span>
    						- 
						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).
					</li>
        <li><span>callback (<span class="arg-type" title="A reference to a Javascript function.">Function</span>)</span>
    						- 
						A function to be executed whenever the animation completes, executes once for each element animated against.
&lt;pre&gt;function callback() {
  this; // dom element
}
&lt;/pre&gt;
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Animates all divs to slide down and show themselves over 600 milliseconds.
					</p>
    <pre>
      <code class="javascript">$(document.body).click(function () {
      if ($("div:first").is(":hidden")) {
        $("div").slideDown("slow");
      } else {
        $("div").hide();
      }
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  Click me!
  &lt;div&gt;&lt;/div&gt;
  &lt;div&gt;&lt;/div&gt;
  &lt;div&gt;&lt;/div&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Animates all inputs to slide down, completing the animation within 1000 milliseconds. Once the animation is done, the input look is changed especially if it is the middle input which gets the focus.
					</p>
    <pre>
      <code class="javascript">$("div").click(function () {
      $(this).css({ borderStyle:"inset", cursor:"wait" });
      $("input").slideDown(1000,function(){
        $(this).css("border", "2px red inset")
               .filter(".middle")
                 .css("background", "yellow")
                 .focus();
        $("div").css("visibility", "hidden");
      });
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div&gt;Push!&lt;/div&gt;
  &lt;input type="text" /&gt;
  &lt;input type="text" class="middle" /&gt;
  &lt;input type="text" /&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4668395" d:title="Effects/slideToggle(speed, callback)">
    <d:index d:value="slideToggle" d:title="Effects/slideToggle(speed, callback)"/>
    <p class="title">Effects/slideToggle(speed, callback)</p>
    <p>
					Toggle the visibility of all matched elements by adjusting their height and firing an optional callback after completion.
				</p>
    <p>
					Only the height is adjusted for this animation, causing all matched elements to be hidden or shown in a "sliding" manner. As of jQuery 1.3 the vertical padding and vertical margin are also animated, creating a smoother effect.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>speed (<span class="arg-type" title="">String, Number </span>)</span>
    						- 
						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).
					</li>
        <li><span>callback (<span class="arg-type" title="A reference to a Javascript function.">Function</span>)</span>
    						- 
						A function to be executed whenever the animation completes, executes once for each element animated against.
&lt;pre&gt;function callback() {
  this; // dom element
}
&lt;/pre&gt;
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Animates all paragraphs to slide up or down, completing the animation within 600 milliseconds.
					</p>
    <pre>
      <code class="javascript">$("button").click(function () {
      $("p").slideToggle("slow");
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;button&gt;Toggle&lt;/button&gt;
  &lt;p&gt;
    This is the paragraph to end all paragraphs.  You
    should feel &lt;em&gt;lucky&lt;/em&gt; to have seen such a paragraph in
    your life.  Congratulations!
  &lt;/p&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Animates divs between dividers with a toggle that makes some appear and some disappear.
					</p>
    <pre>
      <code class="javascript">$("#aa").click(function () {
      $("div:not(.still)").slideToggle("slow", function () {
        var n = parseInt($("span").text(), 10);
        $("span").text(n + 1);
      });
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;button id =aa&gt;Toggle&lt;/button&gt; There have been &lt;span&gt;0&lt;/span&gt; toggled divs.
  &lt;div&gt;&lt;/div&gt;&lt;div class="still"&gt;&lt;/div&gt;
  &lt;div style="display:none;"&gt;&lt;/div&gt;&lt;div class="still"&gt;&lt;/div&gt;
  &lt;div&gt;&lt;/div&gt;&lt;div class="still"&gt;&lt;/div&gt;
  &lt;div class="hider"&gt;&lt;/div&gt;&lt;div class="still"&gt;&lt;/div&gt;
  &lt;div class="hider"&gt;&lt;/div&gt;&lt;div class="still"&gt;&lt;/div&gt;
  &lt;div&gt;&lt;/div&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4668282" d:title="Effects/slideUp(speed, callback)">
    <d:index d:value="slideUp" d:title="Effects/slideUp(speed, callback)"/>
    <p class="title">Effects/slideUp(speed, callback)</p>
    <p>
					Hide all matched elements by adjusting their height and firing an optional callback after completion.
				</p>
    <p>
					Only the height is adjusted for this animation, causing all matched elements to be hidden in a "sliding" manner. As of jQuery 1.3 the vertical padding and vertical margin are also animated, creating a smoother effect.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>speed (<span class="arg-type" title="">String, Number </span>)</span>
    						- 
						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).
					</li>
        <li><span>callback (<span class="arg-type" title="A reference to a Javascript function.">Function</span>)</span>
    						- 
						A function to be executed whenever the animation completes, executes once for each element animated against.
&lt;pre&gt;function callback() {
  this; // dom element
}
&lt;/pre&gt;
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Animates all divs to slide up, completing the animation within 400 milliseconds.
					</p>
    <pre>
      <code class="javascript">$(document.body).click(function () {
      if ($("div:first").is(":hidden")) {
        $("div").show("slow");
      } else {
        $("div").slideUp();
      }
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  Click me!
  &lt;div&gt;&lt;/div&gt;
  &lt;div&gt;&lt;/div&gt;
  &lt;div&gt;&lt;/div&gt;
  &lt;div&gt;&lt;/div&gt;
  &lt;div&gt;&lt;/div&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Animates all paragraph to slide up, completing the animation within 200 milliseconds. Once the animation is done, it displays an alert.
					</p>
    <pre>
      <code class="javascript">$("button").click(function () {
      $(this).parent().slideUp("slow", function () {
        $("#msg").text($("button", this).text() + " has completed.");
      });
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div&gt;
    &lt;button&gt;Hide One&lt;/button&gt;
    &lt;input type="text" value="One" /&gt;
  &lt;/div&gt;
  &lt;div&gt;
    &lt;button&gt;Hide Two&lt;/button&gt;
    &lt;input type="text" value="Two" /&gt;
  &lt;/div&gt;
  &lt;div&gt;
    &lt;button&gt;Hide Three&lt;/button&gt;
    &lt;input type="text" value="Three" /&gt;
  &lt;/div&gt;
  &lt;div id="msg"&gt;&lt;/div&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4669258" d:title="Effects/stop(clearQueue, gotoEnd)">
    <d:index d:value="stop" d:title="Effects/stop(clearQueue, gotoEnd)"/>
    <p class="title">Effects/stop(clearQueue, gotoEnd)</p>
    <p>
					Stops all the currently running animations on all the specified elements. 
				</p>
    <p>
					If any animations are queued to run (and the clearQueue argument is not set to true), then they will begin immediately. 
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>clearQueue (<span class="arg-type" title="true or false.">Boolean</span>)</span>
    						- 
						A Boolean (true/false) that when set to true clears the animation queue, effectively stopping all queued animations.
					</li>
        <li><span>gotoEnd (<span class="arg-type" title="true or false.">Boolean</span>)</span>
    						- 
						A Boolean (true/false) that when set to true causes the currently playing animation to immediately complete, including resetting original styles on show and hide and calling the callback function
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Click the Go button once to start the animation, then click the STOP button to stop it where it's currently positioned.  Another option is to click several buttons to queue them up and see that stop just kills the currently playing one.
					</p>
    <pre>
      <code class="javascript">// Start animation
    $("#go").click(function(){
      $(".block").animate({left: '+=100px'}, 2000);
    });

    // Stop animation when button is clicked
    $("#stop").click(function(){
      $(".block").stop();
    });

    // Start animation in the opposite direction
    $("#back").click(function(){
      $(".block").animate({left: '-=100px'}, 2000);
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;button id="go"&gt;Go&lt;/button&gt; 
  &lt;button id="stop"&gt;STOP!&lt;/button&gt;
  &lt;button id="back"&gt;Back&lt;/button&gt;
  &lt;div class="block"&gt;&lt;/div&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4605424" d:title="Selectors/submit()">
    <d:index d:value="submit" d:title="Selectors/submit()"/>
    <p class="title">Selectors/submit()</p>
    <p>
					Matches all input elements of type submit.
				</p>
    <p>
					
				</p>
    <h2>Example:</h2>
    <p>
						Finds all submit inputs.
					</p>
    <pre>
      <code class="javascript">var input = $(":submit").parent('td').css({background:"yellow", border:"3px red solid"});
    
    $('#result').text('jQuery matched ' + input.length + ' elements.');

    // so it won't submit
    $("form").submit(function () { return false; });
    
    // Extra JS to make the HTML easier to edit (None of this is relevant to the ':submit' selector
    $('#exampleTable').find('td').each(function(i, el) {
        var inputEl = $(el).children().get(0);
        $(el).before('&lt;td&gt;' + $(inputEl).attr('type') + '&lt;/td&gt;');
    })
    

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;table&gt;
&lt;form&gt;
&lt;table id="exampleTable" border="1" cellpadding="10" align="center"&gt;
    &lt;tr&gt;
        &lt;th&gt;
            Element Type
        &lt;/th&gt;
        &lt;th&gt;
            Element
        &lt;/th&gt;
    &lt;/tr
    &lt;tr&gt;
        &lt;td&gt;
            &lt;input type="button" value="Input Button"/&gt;
        &lt;/td&gt;
    &lt;/tr&gt;
    &lt;tr&gt;
        &lt;td&gt;
            &lt;input type="checkbox" /&gt;
        &lt;/td&gt;
    &lt;/tr&gt;
    &lt;tr&gt;
        &lt;td&gt;
            &lt;input type="file" /&gt;
        &lt;/td&gt;
    &lt;/tr&gt;
    &lt;tr&gt;
        &lt;td&gt;
            &lt;input type="hidden" /&gt;
        &lt;/td&gt;
    &lt;/tr&gt;
    &lt;tr&gt;
        &lt;td&gt;
            &lt;input type="image" /&gt;
        &lt;/td&gt;
    &lt;/tr&gt;
    &lt;tr&gt;
        &lt;td&gt;
            &lt;input type="password" /&gt;
        &lt;/td&gt;
    &lt;/tr&gt;
    &lt;tr&gt;
        &lt;td&gt;
            &lt;input type="radio" /&gt;
        &lt;/td&gt;
    &lt;/tr&gt;
    &lt;tr&gt;
        &lt;td&gt;
            &lt;input type="reset" /&gt;
        &lt;/td&gt;
    &lt;/tr&gt;
    &lt;tr&gt;
        &lt;td&gt;
            &lt;input type="submit" /&gt;
        &lt;/td&gt;
    &lt;/tr&gt;
    &lt;tr&gt;
        &lt;td&gt;
            &lt;input type="text" /&gt;
        &lt;/td&gt;
    &lt;/tr&gt;
    &lt;tr&gt;
        &lt;td&gt;
            &lt;select&gt;&lt;option&gt;Option&lt;/option&gt;&lt;/select&gt;
        &lt;/td&gt;
    &lt;/tr&gt;
    &lt;tr&gt;
        &lt;td&gt;
            &lt;textarea&gt;&lt;/textarea&gt;
        &lt;/td&gt;
    &lt;/tr&gt;
    &lt;tr&gt;
        &lt;td&gt;
            &lt;button&gt;Button&lt;/button&gt;
          &lt;/td&gt;
      &lt;/tr&gt;
&lt;/table&gt;
&lt;/form&gt;
&lt;div id="result"&gt;&lt;/div&gt;

					</code>
    </pre>
  </d:entry>
  <d:entry id="id4667442" d:title="Events/submit()">
    <d:index d:value="submit" d:title="Events/submit()"/>
    <p class="title">Events/submit()</p>
    <p>
					Trigger the submit event of each matched element.
				</p>
    <p>
					This causes all of the functions that have been bound to that submit event to be executed, and calls the browser's default submit action on the matching element(s). This default action can be prevented by returning false from one of the functions bound to the submit event.
				</p>
    <h2>Example:</h2>
    <p>
						To trigger the submit event on the first form on the page, try:
					</p>
    <pre>
      <code class="javascript">$("form:first").submit();
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4667477" d:title="Events/submit(fn)">
    <d:index d:value="submit" d:title="Events/submit(fn)"/>
    <p class="title">Events/submit(fn)</p>
    <p>
					Bind a function to the submit event of each matched element.
				</p>
    <p>
					The submit event fires when a form is submitted
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>fn (<span class="arg-type" title="A reference to a Javascript function.">Function</span>)</span>
    						- 
						A function to bind to the submit event on each of the matched elements.
&lt;pre&gt;function callback(eventObject) {
  this; // dom element
}
&lt;/pre&gt;
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						If you'd like to prevent forms from being submitted unless a flag variable is set, try:
					</p>
    <pre>
      <code class="javascript">$("form").submit(function() {
      if ($("input:first").val() == "correct") {
        $("span").text("Validated...").show();
        return true;
      }
      $("span").text("Not valid!").show().fadeOut(1000);
      return false;
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;Type 'correct' to validate.&lt;/p&gt;
  &lt;form action="javascript:alert('success!');"&gt;
    &lt;div&gt;
      &lt;input type="text" /&gt;
      &lt;input type="submit" /&gt;
    &lt;/div&gt;
  &lt;/form&gt;
  &lt;span&gt;&lt;/span&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						If you'd like to prevent forms from being submitted unless a flag variable is set, try:
					</p>
    <pre>
      <code class="javascript">$("form").submit( function () {
  return this.some_flag_variable;
} );
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4605225" d:title="Selectors/text()">
    <d:index d:value="text" d:title="Selectors/text()"/>
    <p class="title">Selectors/text()</p>
    <p>
					Matches all elements of type text.
				</p>
    <p>
					Using this psuedo-selector like &lt;code&gt;$(':text')&lt;/code&gt; is equivalent to &lt;code&gt;$('*:text')&lt;/code&gt; which is a very slow selector. It's recommended to do &lt;code&gt;$('input:text')&lt;/code&gt;.
				</p>
    <h2>Example:</h2>
    <p>
						Finds all text inputs.
					</p>
    <pre>
      <code class="javascript">var input = $("form input:text").css({background:"yellow", border:"3px red solid"});
    $("div").text("For this type jQuery found " + input.length + ".")
            .css("color", "red");
    $("form").submit(function () { return false; }); // so it won't submit

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;form&gt;
    &lt;input type="button" value="Input Button"/&gt;
    &lt;input type="checkbox" /&gt;
    &lt;input type="file" /&gt;
    &lt;input type="hidden" /&gt;
    &lt;input type="image" /&gt;
    &lt;input type="password" /&gt;
    &lt;input type="radio" /&gt;
    &lt;input type="reset" /&gt;
    &lt;input type="submit" /&gt;
    &lt;input type="text" /&gt;
    &lt;select&gt;&lt;option&gt;Option&lt;option/&gt;&lt;/select&gt;
    &lt;textarea&gt;&lt;/textarea&gt;
    &lt;button&gt;Button&lt;/button&gt;
  &lt;/form&gt;
  &lt;div&gt;
  &lt;/div&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4606698" d:title="Attributes/text()">
    <d:index d:value="text" d:title="Attributes/text()"/>
    <p class="title">Attributes/text()</p>
    <p>
					Get the combined text contents of all matched elements.
				</p>
    <p>
					The result is a string that contains the combined text contents of all matched elements. This method works on both HTML and XML documents.  Cannot be used on input elements.  For input field text use the 
&lt;a href='Attributes/val#val'&gt;val attribute&lt;/a&gt;					.
				</p>
    <h2>Example:</h2>
    <p>
						Find the text in the first paragraph (stripping out the html), then set the html of the last paragraph to show it is just text (the red bold is gone).
					</p>
    <pre>
      <code class="javascript">var str = $("p:first").text();
    $("p:last").html(str);

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;&lt;b&gt;Test&lt;/b&gt; Paragraph.&lt;/p&gt;
  &lt;p&gt;&lt;/p&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4609102" d:title="Attributes/text()">
    <d:index d:value="text" d:title="Attributes/text()"/>
    <p class="title">Attributes/text()</p>
    <p>
					Get the combined text contents of all matched elements.
				</p>
    <p>
					The result is a string that contains the combined text contents of all matched elements. This method works on both HTML and XML documents.  Cannot be used on input elements.  For input field text use the 
&lt;a href='Attributes/val#val'&gt;val attribute&lt;/a&gt;					.
				</p>
    <h2>Example:</h2>
    <p>
						Find the text in the first paragraph (stripping out the html), then set the html of the last paragraph to show it is just text (the red bold is gone).
					</p>
    <pre>
      <code class="javascript">var str = $("p:first").text();
    $("p:last").html(str);

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;&lt;b&gt;Test&lt;/b&gt; Paragraph.&lt;/p&gt;
  &lt;p&gt;&lt;/p&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4606748" d:title="Attributes/text(val)">
    <d:index d:value="text" d:title="Attributes/text(val)"/>
    <p class="title">Attributes/text(val)</p>
    <p>
					Set the text contents of all matched elements.
				</p>
    <p>
					Similar to html(), but escapes HTML (replace "&lt;" and "&gt;" with their HTML entities).  Cannot be used on input elements.  For input field text use the 
&lt;a href='Attributes/val#val'&gt;val attribute&lt;/a&gt;					.<br xmlns=""/><br xmlns=""/>				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>val (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						The text value to set the contents of the element to.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Add text to the paragraph (notice the bold tag is escaped).
					</p>
    <pre>
      <code class="javascript">$("p").text("&lt;b&gt;Some&lt;/b&gt; new text.");
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;Test Paragraph.&lt;/p&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4609151" d:title="Attributes/text(val)">
    <d:index d:value="text" d:title="Attributes/text(val)"/>
    <p class="title">Attributes/text(val)</p>
    <p>
					Set the text contents of all matched elements.
				</p>
    <p>
					Similar to html(), but escapes HTML (replace "&lt;" and "&gt;" with their HTML entities).  Cannot be used on input elements.  For input field text use the 
&lt;a href='Attributes/val#val'&gt;val attribute&lt;/a&gt;					.<br xmlns=""/><br xmlns=""/>				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>val (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						The text value to set the contents of the element to.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Add text to the paragraph (notice the bold tag is escaped).
					</p>
    <pre>
      <code class="javascript">$("p").text("&lt;b&gt;Some&lt;/b&gt; new text.");
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;Test Paragraph.&lt;/p&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4667983" d:title="Effects/toggle()">
    <d:index d:value="toggle" d:title="Effects/toggle()"/>
    <p class="title">Effects/toggle()</p>
    <p>
					Toggle displaying each of the set of matched elements.
				</p>
    <p>
					If they are shown, toggle makes them hidden (using the hide method). If they are hidden, toggle makes them shown (using the show method).
				</p>
    <h2>Example:</h2>
    <p>
						Toggles all paragraphs.
					</p>
    <pre>
      <code class="javascript">$("button").click(function () {
      $("p").toggle();
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;button&gt;Toggle&lt;/button&gt;
  &lt;p&gt;Hello&lt;/p&gt;
  &lt;p style="display: none"&gt;Good Bye&lt;/p&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4668025" d:title="Effects/toggle(switch)">
    <d:index d:value="toggle" d:title="Effects/toggle(switch)"/>
    <p class="title">Effects/toggle(switch)</p>
    <p>
					Toggle displaying each of the set of matched elements based upon the switch (true shows all elements, false hides all elements).
				</p>
    <p>
					If the switch is false, toggle makes them hidden (using the hide method). If the switch is true, toggle makes them shown (using the show method).
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>switch (<span class="arg-type" title="true or false.">Boolean</span>)</span>
    						- 
						A switch to toggle the display on.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Shows all paragraphs, then hides them all, back and forth.
					</p>
    <pre>
      <code class="javascript">var flip = 0;
    $("button").click(function () {
      $("p").toggle( flip++ % 2 == 0 );
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;button&gt;Toggle&lt;/button&gt;
  &lt;p&gt;Hello&lt;/p&gt;
  &lt;p style="display: none"&gt;Good Bye&lt;/p&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4668080" d:title="Effects/toggle(speed, callback)">
    <d:index d:value="toggle" d:title="Effects/toggle(speed, callback)"/>
    <p class="title">Effects/toggle(speed, callback)</p>
    <p>
					Toggle displaying each of the set of matched elements using a graceful animation and firing an optional callback after completion.
				</p>
    <p>
					The height, width, and opacity of each of the matched elements are changed dynamically according to the specified speed. As of jQuery 1.3 the padding and margin are also animated, creating a smoother effect.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>speed (<span class="arg-type" title="">String, Number </span>)</span>
    						- 
						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).
					</li>
        <li><span>callback (<span class="arg-type" title="A reference to a Javascript function.">Function</span>)</span>
    						- 
						A function to be executed whenever the animation completes, executes once for each element animated against.
&lt;pre&gt;function callback() {
  this; // dom element
}
&lt;/pre&gt;
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Animates all paragraphs to be shown if they are hidden and hidden if they are visible, completing the animation within 600 milliseconds.
					</p>
    <pre>
      <code class="javascript">$("button").click(function () {
      $("p").toggle("slow");
    });    

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;button&gt;Toggle 'em&lt;/button&gt;
  &lt;p&gt;Hiya&lt;/p&gt;
  &lt;p&gt;Such interesting text, eh?&lt;/p&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4613030" d:title="Events/toggle(fn, fn2, fn3,fn4,...)">
    <d:index d:value="toggle" d:title="Events/toggle(fn, fn2, fn3,fn4,...)"/>
    <p class="title">Events/toggle(fn, fn2, fn3,fn4,...)</p>
    <p>
					Toggle among two or more function calls every other click.
				</p>
    <p>
					&lt;p&gt;Whenever a matched element is clicked, the first specified function is fired, when clicked again, the second is fired, and so on. All subsequent clicks continue to rotate through the functions.&lt;/p&gt;&lt;p&gt;Use unbind("click") to remove the toggle event.&lt;/p&gt;
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>fn (<span class="arg-type" title="A reference to a Javascript function.">Function</span>)</span>
    						- 
						The function to execute.
&lt;pre&gt;function callback(eventObject) {
  this; // dom element
}
&lt;/pre&gt;
					</li>
        <li><span>fn2 (<span class="arg-type" title="A reference to a Javascript function.">Function</span>)</span>
    						- 
						The function to execute.
&lt;pre&gt;function callback(eventObject) {
  this; // dom element
}
&lt;/pre&gt;
					</li>
        <li><span>fn3,fn4,... (<span class="arg-type" title="A reference to a Javascript function.">Function</span>)</span>
    						- 
						The function to execute.
&lt;pre&gt;function callback(eventObject) {
  this; // dom element
}
&lt;/pre&gt;
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Click to toggle highlight on the list item.
					</p>
    <pre>
      <code class="javascript">$("li").toggle(
      function () {
        $(this).css({"list-style-type":"disc", "color":"blue"});
      },
      function () {
        $(this).css({"list-style-type":"disc", "color":"red"});
      },
      function () {
        $(this).css({"list-style-type":"", "color":""});
      }
    );

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;ul&gt;
    &lt;li&gt;Go to the store&lt;/li&gt;
    &lt;li&gt;Pick up dinner&lt;/li&gt;
    &lt;li&gt;Debug crash&lt;/li&gt;
    &lt;li&gt;Take a jog&lt;/li&gt;
  &lt;/ul&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						To toggle a style on table cells:
					</p>
    <pre>
      <code class="javascript">$("td").toggle(
  function () {
    $(this).addClass("selected");
  },
  function () {
    $(this).removeClass("selected");
  }
);
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4606434" d:title="Attributes/toggleClass(class)">
    <d:index d:value="toggleClass" d:title="Attributes/toggleClass(class)"/>
    <p class="title">Attributes/toggleClass(class)</p>
    <p>
					Adds the specified class if it is not present, removes the specified class if it is present.
				</p>
    <p>
					
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>class (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						A CSS class to toggle on the elements.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Toggle the class 'highlight' when a paragraph is clicked.
					</p>
    <pre>
      <code class="javascript">$("p").click(function () {
      $(this).toggleClass("highlight");
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p class="blue"&gt;Click to toggle&lt;/p&gt;
  &lt;p class="blue highlight"&gt;highlight&lt;/p&gt;
  &lt;p class="blue"&gt;on these&lt;/p&gt;
  &lt;p class="blue"&gt;paragraphs&lt;/p&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4606492" d:title="Attributes/toggleClass(class, switch)">
    <d:index d:value="toggleClass" d:title="Attributes/toggleClass(class, switch)"/>
    <p class="title">Attributes/toggleClass(class, switch)</p>
    <p>
					'''New in jQuery 1.3''' Adds the specified class if the switch is true, removes the specified class if the switch is false.
				</p>
    <p>
					
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>class (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						A CSS class to toggle on the elements.
					</li>
        <li><span>switch (<span class="arg-type" title="true or false.">Boolean</span>)</span>
    						- 
						A boolean value to toggle the class by.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Toggle the class 'highlight' on every third click.
					</p>
    <pre>
      <code class="javascript">var count = 0;
    $("p").click(function(){
      $(this).toggleClass("highlight", count++ % 3 == 0);
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p class="blue"&gt;Click to toggle&lt;/p&gt;
  &lt;p class="blue highlight"&gt;highlight&lt;/p&gt;
  &lt;p class="blue"&gt;on these&lt;/p&gt;
  &lt;p class="blue"&gt;paragraphs&lt;/p&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4612296" d:title="Events/trigger(event , data )">
    <d:index d:value="trigger" d:title="Events/trigger(event , data )"/>
    <p class="title">Events/trigger(event , data )</p>
    <p>
					Trigger an event on every matched element.
				</p>
    <p>
					&lt;p&gt;This will also cause the default action of the browser with the same name (if one exists) to be executed. For example, passing 'submit' to the trigger() function will also cause the browser to submit the form. This default action can be prevented by returning false from one of the functions bound to the event.&lt;/p&gt;<br xmlns=""/><br xmlns=""/>&lt;p&gt;Triggered events aren't limited to browser-based events, you can also trigger custom events registered with bind.&lt;/p&gt;<br xmlns=""/><br xmlns=""/>&lt;p&gt;The event handlers will receive a fixed (normalized) event object but it won't contain any of the browser-specific attributes (like keyCode, pageX, or pageY).&lt;/p&gt;<br xmlns=""/><br xmlns=""/>&lt;p&gt;jQuery also supports 
&lt;a href='Namespaced_Events'&gt;namespaced events&lt;/a&gt;					. These allow you to trigger or unbind specific groups of bound handlers without having to reference them directly. You can add an '''!''' to the end of the event type in order to trigger only handlers that don't have a namespace specified.&lt;/p&gt;<br xmlns=""/><br xmlns=""/>'''New in jQuery 1.3:'''<br xmlns=""/><br xmlns=""/>&lt;p&gt;All triggered events now bubble up the DOM tree. For example if you trigger an event on a paragraph then it will trigger on that element first, then on the parent element, and its parent, and so on up to the document. The event object will have a .target property equal to the original triggered element. You can prevent the bubbling by calling 
&lt;a href='Events/jQuery.Event#event.stopPropagation()'&gt;stopPropagation()&lt;/a&gt;					 or by returning false from your callback.&lt;/p&gt;<br xmlns=""/><br xmlns=""/>&lt;p&gt;The event object constructor is now exposed and you can use it to create your own event object. 
The full list of properties that are available on the event object (passed to the triggered bound handlers) can be found in the 
&lt;a href='Events/jQuery.Event'&gt;jQuery.Event&lt;/a&gt;					 documentation.&lt;/p&gt;<br xmlns=""/><br xmlns=""/>&lt;P&gt;You have 3 ways of specifying the event type:&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;You can pass the event name (type) which is a string
&lt;/li&gt;
&lt;li&gt;You can also use a 
&lt;a href='Events/jQuery.Event'&gt;jQuery.Event object&lt;/a&gt;					.
You can put data into this object and it will reach the triggered handlers.
&lt;/li&gt;
&lt;li&gt;Finally, you can pass a literal object with data. It will be copied to a real 
&lt;a href='Events/jQuery.Event'&gt;jQuery.Event object&lt;/a&gt;					.
Note that you '''must''' specify a ''type'' attribute in this case.
&lt;/li&gt;
&lt;/ul&gt;<br xmlns=""/><br xmlns=""/>				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>event  (<span class="arg-type" title="">String,Event,Object</span>)</span>
    						- 
						An event object or type to trigger.
					</li>
        <li><span>data  (<span class="arg-type" title="">Array</span>)</span>
    						- 
						Additional data to pass as arguments (after the event object) to the event handler.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Clicks to button #2 also trigger a click for button #1.
					</p>
    <pre>
      <code class="javascript">$("button:first").click(function () {
      update($("span:first"));
    });
    $("button:last").click(function () {
      $("button:first").trigger('click');

      update($("span:last"));
    });

    function update(j) {
      var n = parseInt(j.text(), 10);
      j.text(n + 1);
    }

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;button&gt;Button #1&lt;/button&gt;
  &lt;button&gt;Button #2&lt;/button&gt;
  &lt;div&gt;&lt;span&gt;0&lt;/span&gt; button #1 clicks.&lt;/div&gt;
  &lt;div&gt;&lt;span&gt;0&lt;/span&gt; button #2 clicks.&lt;/div&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						To submit the first form without using the submit() function, try:
					</p>
    <pre>
      <code class="javascript">$("form:first").trigger("submit")
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						To submit the first form without using the submit() function, try:
					</p>
    <pre>
      <code class="javascript">var event = jQuery.Event("submit");
$("form:first").trigger(event);
if ( event.isDefaultPrevented() ) {
  // Perform an action...
}
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						To pass arbitrary data to an event:
					</p>
    <pre>
      <code class="javascript">$("p").click( function (event, a, b) {
  // when a normal click fires, a and b are undefined
  // for a trigger like below a refers to "foo" and b refers to "bar"
} ).trigger("click", ["foo", "bar"]);
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						To pass arbitrary data through an event object:
					</p>
    <pre>
      <code class="javascript">var event = jQuery.Event("logged");
event.user = "foo";
event.pass = "bar";
$("body").trigger(event);
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Alternate way to pass data through an event object:
					</p>
    <pre>
      <code class="javascript">$("body").trigger({
  type:"logged",
  user:"foo",
  pass:"bar"
});
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4612456" d:title="Events/triggerHandler(event , data )">
    <d:index d:value="triggerHandler" d:title="Events/triggerHandler(event , data )"/>
    <p class="title">Events/triggerHandler(event , data )</p>
    <p>
					Triggers all bound event handlers on an element (for a specific event type) WITHOUT executing the browser's default actions, bubbling, or live events.
				</p>
    <p>
					&lt;p&gt;This method behaves very similarly to the trigger method, with two major exceptions:&lt;/p&gt;
&lt;p&gt;First, no default browser actions are triggered, the triggered event does not bubble, and live events aren't triggered.&lt;/p&gt;&lt;p&gt;Second, the event is only triggered on the first element within the jQuery collection.  This method returns the return value of the triggered handler instead of a chainable jQuery object.  Also, if the jQuery collection is empty, this method returns 'undefined'.&lt;/p&gt;
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>event  (<span class="arg-type" title="">String,Event,Object</span>)</span>
    						- 
						An event type to trigger.
					</li>
        <li><span>data  (<span class="arg-type" title="">Array</span>)</span>
    						- 
						Additional data to pass as arguments (after the event object) to the event handler.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						If you called .triggerHandler() on a focus event - the browsers default focus action would not be triggered, only the event handlers bound to the focus event.
					</p>
    <pre>
      <code class="javascript">$("#old").click(function(){
      $("input").trigger("focus");
    });
    $("#new").click(function(){
      $("input").triggerHandler("focus");
    });
    $("input").focus(function(){
      $("&lt;span&gt;Focused!&lt;/span&gt;").appendTo("body").fadeOut(1000);
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;button id="old"&gt;.trigger("focus")&lt;/button&gt;
  &lt;button id="new"&gt;.triggerHandler("focus")&lt;/button&gt;&lt;br/&gt;&lt;br/&gt;
  &lt;input type="text" value="To Be Focused"/&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4612535" d:title="Events/unbind(type , fn )">
    <d:index d:value="unbind" d:title="Events/unbind(type , fn )"/>
    <p class="title">Events/unbind(type , fn )</p>
    <p>
					This does the opposite of bind, it removes bound events from each of the matched elements.
				</p>
    <p>
					&lt;p&gt;Without any arguments, all bound events are removed. If the type is provided, all bound events of that type are removed. If the function that was passed to bind is provided as the second argument, only that specific event handler is removed.&lt;/p&gt;&lt;p&gt;You can also unbind custom events registered with bind.&lt;/p&gt;
&lt;p&gt;jQuery also supports 
&lt;a href='Namespaced_Events'&gt;namespaced events&lt;/a&gt;					. These allow you to trigger or unbind specific groups of bound handlers without having to reference them directly.&lt;/p&gt;
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>type  (<span class="arg-type" title="">String,Event,Object</span>)</span>
    						- 
						One or more event types separated by a space.
					</li>
        <li><span>fn  (<span class="arg-type" title="A reference to a Javascript function.">Function</span>)</span>
    						- 
						A function to unbind from the event on each of the set of matched elements.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Can bind and unbind events to the colored button.
					</p>
    <pre>
      <code class="javascript">function aClick() {
      $("div").show().fadeOut("slow");
    }
    $("#bind").click(function () {
      // could use .bind('click', aClick) instead but for variety...
      $("#theone").click(aClick)
                  .text("Can Click!");
    });
    $("#unbind").click(function () {
      $("#theone").unbind('click', aClick)
                  .text("Does nothing...");
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;button id="theone"&gt;Does nothing...&lt;/button&gt;
  &lt;button id="bind"&gt;Bind Click&lt;/button&gt;
  &lt;button id="unbind"&gt;Unbind Click&lt;/button&gt;
  &lt;div style="display:none;"&gt;Click!&lt;/div&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						To unbind all events from all paragraphs, write:
					</p>
    <pre>
      <code class="javascript">$("p").unbind()
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						To unbind all click events from all paragraphs, write:
					</p>
    <pre>
      <code class="javascript">$("p").unbind( "click" )
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						To unbind just one previously bound handler, pass the function in as the second argument:
					</p>
    <pre>
      <code class="javascript">var foo = function () {
  // code to handle some kind of event
};

$("p").bind("click", foo); // ... now foo will be called when paragraphs are clicked ...

$("p").unbind("click", foo); // ... foo will no longer be called.
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4667556" d:title="Events/unload(fn)">
    <d:index d:value="unload" d:title="Events/unload(fn)"/>
    <p class="title">Events/unload(fn)</p>
    <p>
					Binds a function to the unload event of each matched element.
				</p>
    <p>
					
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>fn (<span class="arg-type" title="A reference to a Javascript function.">Function</span>)</span>
    						- 
						function to bind to the unload event on each of the matched elements.
&lt;pre&gt;function callback(eventObject) {
  this; // dom element
}
&lt;/pre&gt;
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						To display an alert when a page is unloaded:
					</p>
    <pre>
      <code class="javascript">$(window).unload( function () { alert("Bye now!"); } );
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4606815" d:title="Attributes/val()">
    <d:index d:value="val" d:title="Attributes/val()"/>
    <p class="title">Attributes/val()</p>
    <p>
					Get the input value of the first matched element.
				</p>
    <p>
					A value is returned for all input elements, including selects and textareas. For multiple selects an array of values is returned.  <br xmlns=""/><br xmlns=""/>For selects and checkboxes, see the 
&lt;a href='Selectors/selected'&gt;:selected&lt;/a&gt;					 and 
&lt;a href='Selectors/checked'&gt;:checked&lt;/a&gt;					 selectors, for example:
&lt;pre&gt;
$('select.foo option:selected').val();    // get the value from a dropdown select
$('select.foo').val();                    // get the value from a dropdown select even easier
$('input:checkbox:checked').val();        // get the value from a checked checkbox
$('input:radio[name=bar]:checked').val(); // get the value from a set of radio buttons<br xmlns=""/><br xmlns=""/>&lt;/pre&gt;<br xmlns=""/><br xmlns=""/>&lt;small&gt;For older versions of jQuery use the [http://www.malsup.com/jquery/form/#fields fieldValue function of the Form Plugin].&lt;/small&gt;
				</p>
    <h2>Example:</h2>
    <p>
						Get the single value from a single select and an array of values from a multiple select and display their values.
					</p>
    <pre>
      <code class="javascript">function displayVals() {
      var singleValues = $("#single").val();
      var multipleValues = $("#multiple").val() || [];
      $("p").html("&lt;b&gt;Single:&lt;/b&gt; " + 
                  singleValues +
                  " &lt;b&gt;Multiple:&lt;/b&gt; " + 
                  multipleValues.join(", "));
    }

    $("select").change(displayVals);
    displayVals();

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;&lt;/p&gt;
  &lt;select id="single"&gt;
    &lt;option&gt;Single&lt;/option&gt;
    &lt;option&gt;Single2&lt;/option&gt;
  &lt;/select&gt;
  &lt;select id="multiple" multiple="multiple"&gt;
    &lt;option selected="selected"&gt;Multiple&lt;/option&gt;
    &lt;option&gt;Multiple2&lt;/option&gt;
    &lt;option selected="selected"&gt;Multiple3&lt;/option&gt;
  &lt;/select&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Find the value of an input box.
					</p>
    <pre>
      <code class="javascript">$("input").keyup(function () {
      var value = $(this).val();
      $("p").text(value);
    }).keyup();

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;input type="text" value="some text"/&gt;
  &lt;p&gt;&lt;/p&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4606894" d:title="Attributes/val(val)">
    <d:index d:value="val" d:title="Attributes/val(val)"/>
    <p class="title">Attributes/val(val)</p>
    <p>
					Set the value attribute of every matched element.
				</p>
    <p>
					In jQuery 1.2, this is also able to set the value of select elements, but selecting the appropriate options.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>val (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						The value to set on the matched element.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Set the value of an input box.
					</p>
    <pre>
      <code class="javascript">$("button").click(function () {
      var text = $(this).text();
      $("input").val(text);
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div&gt;
    &lt;button&gt;Feed&lt;/button&gt;
    &lt;button&gt;the&lt;/button&gt;
    &lt;button&gt;Input&lt;/button&gt;
  &lt;/div&gt;
  &lt;input type="text" value="click a button" /&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4606954" d:title="Attributes/val(val)">
    <d:index d:value="val" d:title="Attributes/val(val)"/>
    <p class="title">Attributes/val(val)</p>
    <p>
					Checks, or selects, all the radio buttons, checkboxes, and select options that match the set of values.
				</p>
    <p>
					
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>val (<span class="arg-type" title="An Array of strings.">Array&lt;String&gt;</span>)</span>
    						- 
						The set of values to check/select.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Set a single select and a multiple select .
					</p>
    <pre>
      <code class="javascript">$("#single").val("Single2");
    $("#multiple").val(["Multiple2", "Multiple3"]);
    $("input").val(["check1","check2", "radio1" ]);

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;select id="single"&gt;
    &lt;option&gt;Single&lt;/option&gt;
    &lt;option&gt;Single2&lt;/option&gt;
  &lt;/select&gt;
  &lt;select id="multiple" multiple="multiple"&gt;
    &lt;option selected="selected"&gt;Multiple&lt;/option&gt;
    &lt;option&gt;Multiple2&lt;/option&gt;
    &lt;option selected="selected"&gt;Multiple3&lt;/option&gt;
  &lt;/select&gt;&lt;br/&gt;
  &lt;input type="checkbox" name="checkboxname" value="check1"/&gt; check1
  &lt;input type="checkbox" name="checkboxname" value="check2"/&gt; check2
  &lt;input type="radio"  name="r" value="radio1"/&gt; radio1
  &lt;input type="radio"  name="r" value="radio2"/&gt; radio2
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4604309" d:title="Selectors/visible()">
    <d:index d:value="visible" d:title="Selectors/visible()"/>
    <p class="title">Selectors/visible()</p>
    <p>
					Matches all elements that are visible.
				</p>
    <p>
					How :visible is calculated was changed in jQuery 1.3.2. Element assumed as visible if it and its parents consumes space in document. CSS visibility isn't taken into account. The [http://docs.jquery.com/Release:jQuery_1.3.2#:visible.2F:hidden_Overhauled release notes] outline the changes in more detail.
				</p>
    <h2>Example:</h2>
    <p>
						Make all visible divs turn yellow on click.
					</p>
    <pre>
      <code class="javascript">$("div:visible").click(function () {
      $(this).css("background", "yellow");
    });
    $("button").click(function () {
      $("div:hidden").show("fast");
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;button&gt;Show hidden to see they don't change&lt;/button&gt;
  &lt;div&gt;&lt;/div&gt;
  &lt;div class="starthidden"&gt;&lt;/div&gt;
  &lt;div&gt;&lt;/div&gt;
  &lt;div&gt;&lt;/div&gt;
  &lt;div style="display:none;"&gt;&lt;/div&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4611544" d:title="CSS/width()">
    <d:index d:value="width" d:title="CSS/width()"/>
    <p class="title">CSS/width()</p>
    <p>
					Get the current computed, pixel, width of the first matched element.
				</p>
    <p>
					In jQuery 1.2, this method is able to find the width of the window and document.
				</p>
    <h2>Example:</h2>
    <p>
						Show various widths.  Note the values are from the iframe so might be smaller than you expected.  The yellow highlight shows the iframe body.
					</p>
    <pre>
      <code class="javascript">function showWidth(ele, w) {
      $("div").text("The width for the " + ele + 
                    " is " + w + "px.");
    }
    $("#getp").click(function () { 
      showWidth("paragraph", $("p").width()); 
    });
    $("#getd").click(function () { 
      showWidth("document", $(document).width()); 
    });
    $("#getw").click(function () { 
      showWidth("window", $(window).width()); 
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;button id="getp"&gt;Get Paragraph Width&lt;/button&gt;
  &lt;button id="getd"&gt;Get Document Width&lt;/button&gt;
  &lt;button id="getw"&gt;Get Window Width&lt;/button&gt;
  &lt;div&gt;&amp;nbsp;&lt;/div&gt;
  &lt;p&gt;
    Sample paragraph to test width
  &lt;/p&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4611604" d:title="CSS/width(val)">
    <d:index d:value="width" d:title="CSS/width(val)"/>
    <p class="title">CSS/width(val)</p>
    <p>
					Set the CSS width of every matched element.
				</p>
    <p>
					If no explicit unit was specified (like 'em' or '%') then "px" is concatenated to the value.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>val (<span class="arg-type" title="">String, Number</span>)</span>
    						- 
						Set the CSS 'width' property to the specified value.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						To set the width of each div on click to 30px plus a color change.
					</p>
    <pre>
      <code class="javascript">$("div").one('click', function () {
      $(this).width(30)
             .css({cursor:"auto", "background-color":"blue"});
    });

					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;div&gt;&lt;/div&gt;
  &lt;div&gt;d&lt;/div&gt;
  &lt;div&gt;d&lt;/div&gt;
  &lt;div&gt;d&lt;/div&gt;
  &lt;div&gt;d&lt;/div&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4609866" d:title="Manipulation/wrap(html)">
    <d:index d:value="wrap" d:title="Manipulation/wrap(html)"/>
    <p class="title">Manipulation/wrap(html)</p>
    <p>
					Wrap each matched element with the specified HTML content.
				</p>
    <p>
					This wrapping process is most useful for injecting additional structure into a document, without ruining the original semantic qualities of a document.<br xmlns=""/><br xmlns=""/>This works by going through the first element provided (which is generated, on the fly, from the provided HTML) and finds the deepest descendant element within its structure -- it is that element that will enwrap everything else.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>html (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						A string of HTML that will be created on the fly and wrapped around each target.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Wrap a new div around all of the paragraphs.
					</p>
    <pre>
      <code class="javascript">$("p").wrap("&lt;div&gt;&lt;/div&gt;");
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;Hello&lt;/p&gt;
  &lt;p&gt;cruel&lt;/p&gt;
  &lt;p&gt;World&lt;/p&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Wraps a newly created tree of objects around the spans.  Notice anything in between the spans gets left out like the &lt;strong&gt; (red text) in this example.  Even the white space between spans is left out.  Click View Source to see the original html.
					</p>
    <pre>
      <code class="javascript">$("span").wrap("&lt;div&gt;&lt;div&gt;&lt;p&gt;&lt;em&gt;&lt;b&gt;&lt;/b&gt;&lt;/em&gt;&lt;/p&gt;&lt;/div&gt;&lt;/div&gt;");
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;span&gt;Span Text&lt;/span&gt;
  &lt;strong&gt;What about me?&lt;/strong&gt;
  &lt;span&gt;Another One&lt;/span&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4609949" d:title="Manipulation/wrap(elem)">
    <d:index d:value="wrap" d:title="Manipulation/wrap(elem)"/>
    <p class="title">Manipulation/wrap(elem)</p>
    <p>
					Wrap each matched element with the specified element.
				</p>
    <p>
					
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>elem (<span class="arg-type" title="The Javascript object representation of a DOM Element.">Element</span>)</span>
    						- 
						A DOM element that will be wrapped around each target.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Wrap a new div around all of the paragraphs.
					</p>
    <pre>
      <code class="javascript">$("p").wrap(document.createElement("div"));
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;Hello&lt;/p&gt;
  &lt;p&gt;cruel&lt;/p&gt;
  &lt;p&gt;World&lt;/p&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Wrap a jQuery object double depth div around all of the paragraphs.  Notice it doesn't move the object but just clones it to wrap around its target.
					</p>
    <pre>
      <code class="javascript">$("p").wrap($(".doublediv"));
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;Hello&lt;/p&gt;
  &lt;p&gt;cruel&lt;/p&gt;
  &lt;p&gt;World&lt;/p&gt;
  &lt;div class="doublediv"&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4610031" d:title="Manipulation/wrapAll(html)">
    <d:index d:value="wrapAll" d:title="Manipulation/wrapAll(html)"/>
    <p class="title">Manipulation/wrapAll(html)</p>
    <p>
					Wrap all the elements in the matched set into a single wrapper element.
				</p>
    <p>
					This is different from 
&lt;a href='Manipulation/wrap'&gt;.wrap()&lt;/a&gt;					 where each element in the matched set would get wrapped with an element.<br xmlns=""/><br xmlns=""/>This wrapping process is most useful for injecting additional structure into a document, without ruining the original semantic qualities of a document.<br xmlns=""/><br xmlns=""/>This works by going through the first element provided (which is generated, on the fly, from the provided HTML) and finds the deepest descendant element within its structure -- it is that element that will enwrap everything else.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>html (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						A string of HTML that will be created on the fly and wrapped around the target.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Wrap a new div around all of the paragraphs.
					</p>
    <pre>
      <code class="javascript">$("p").wrapAll("&lt;div&gt;&lt;/div&gt;");
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;Hello&lt;/p&gt;
  &lt;p&gt;cruel&lt;/p&gt;
  &lt;p&gt;World&lt;/p&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Wraps a newly created tree of objects around the spans.  Notice anything in between the spans gets left out like the &lt;strong&gt; (red text) in this example.  Even the white space between spans is left out.  Click View Source to see the original html.
					</p>
    <pre>
      <code class="javascript">$("span").wrapAll("&lt;div&gt;&lt;div&gt;&lt;p&gt;&lt;em&gt;&lt;b&gt;&lt;/b&gt;&lt;/em&gt;&lt;/p&gt;&lt;/div&gt;&lt;/div&gt;");
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;span&gt;Span Text&lt;/span&gt;
  &lt;strong&gt;What about me?&lt;/strong&gt;
  &lt;span&gt;Another One&lt;/span&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4610120" d:title="Manipulation/wrapAll(elem)">
    <d:index d:value="wrapAll" d:title="Manipulation/wrapAll(elem)"/>
    <p class="title">Manipulation/wrapAll(elem)</p>
    <p>
					Wrap all the elements in the matched set into a single wrapper element.
				</p>
    <p>
					This is different from 
&lt;a href='Manipulation/wrap'&gt;.wrap()&lt;/a&gt;					 where each element in the matched set would get wrapped with an element.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>elem (<span class="arg-type" title="The Javascript object representation of a DOM Element.">Element</span>)</span>
    						- 
						A DOM element that will be wrapped around the target.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Wrap a new div around all of the paragraphs.
					</p>
    <pre>
      <code class="javascript">$("p").wrapAll(document.createElement("div"));
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;Hello&lt;/p&gt;
  &lt;p&gt;cruel&lt;/p&gt;
  &lt;p&gt;World&lt;/p&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Wrap a jQuery object double depth div around all of the paragraphs.  Notice it doesn't move the object but just clones it to wrap around its target.
					</p>
    <pre>
      <code class="javascript">$("p").wrapAll($(".doublediv"));
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;Hello&lt;/p&gt;
  &lt;p&gt;cruel&lt;/p&gt;
  &lt;p&gt;World&lt;/p&gt;
  &lt;div class="doublediv"&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4610207" d:title="Manipulation/wrapInner(html)">
    <d:index d:value="wrapInner" d:title="Manipulation/wrapInner(html)"/>
    <p class="title">Manipulation/wrapInner(html)</p>
    <p>
					Wrap the inner child contents of each matched element (including text nodes) with an HTML structure.
				</p>
    <p>
					This wrapping process is most useful for injecting additional structure into a document, without ruining the original semantic qualities of a document.<br xmlns=""/><br xmlns=""/>This works by going through the first element provided (which is generated, on the fly, from the provided HTML) and finds the deepest ancestor element within its structure -- it is that element that will enwrap everything else.
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>html (<span class="arg-type" title="A string of characters.">String</span>)</span>
    						- 
						A string of HTML that will be created on the fly and wrapped around the target.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Selects all paragraphs and wraps a bold tag around each of its contents.
					</p>
    <pre>
      <code class="javascript">$("p").wrapInner("&lt;b&gt;&lt;/b&gt;");
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;Hello&lt;/p&gt;
  &lt;p&gt;cruel&lt;/p&gt;
  &lt;p&gt;World&lt;/p&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Wraps a newly created tree of objects around the inside of the body.
					</p>
    <pre>
      <code class="javascript">$("body").wrapInner("&lt;div&gt;&lt;div&gt;&lt;p&gt;&lt;em&gt;&lt;b&gt;&lt;/b&gt;&lt;/em&gt;&lt;/p&gt;&lt;/div&gt;&lt;/div&gt;");
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  Plain old text, or is it?
					</code>
    </pre>
  </d:entry>
  <d:entry id="id4610289" d:title="Manipulation/wrapInner(elem)">
    <d:index d:value="wrapInner" d:title="Manipulation/wrapInner(elem)"/>
    <p class="title">Manipulation/wrapInner(elem)</p>
    <p>
					Wrap the inner child contents of each matched element (including text nodes) with a DOM element.
				</p>
    <p>
					
				</p>
    <h2>Params</h2>
    <p>
      <ul class="params">
        <li><span>elem (<span class="arg-type" title="The Javascript object representation of a DOM Element.">Element</span>)</span>
    						- 
						A DOM element that will be wrapped around the target.
					</li>
      </ul>
    </p>
    <h2>Example:</h2>
    <p>
						Selects all paragraphs and wraps a bold tag around each of its contents.
					</p>
    <pre>
      <code class="javascript">$("p").wrapInner(document.createElement("b"));
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;Hello&lt;/p&gt;
  &lt;p&gt;cruel&lt;/p&gt;
  &lt;p&gt;World&lt;/p&gt;
					</code>
    </pre>
    <h2>Example:</h2>
    <p>
						Selects all paragraphs and wraps a jQuery object around each of its contents.
					</p>
    <pre>
      <code class="javascript">$("p").wrapInner($("&lt;span class='red'&gt;&lt;/span&gt;"));
					</code>
    </pre>
    <h3>HTML:</h3>
    <pre>
      <code class="html">  &lt;p&gt;Hello&lt;/p&gt;
  &lt;p&gt;cruel&lt;/p&gt;
  &lt;p&gt;World&lt;/p&gt;
					</code>
    </pre>
  </d:entry>
</d:dictionary>