First pass at fixing up references to $.fn methods. See #291.

Author: rmurphey

page/ajax/ajax-and-forms.md

@@ -9,9 +9,10 @@ attribution:
 jQuery's ajax capabilities can be especially useful when dealing with forms. There are several advantages, which can range from serialization, to simple client-side validation (e.g. "Sorry, that username is taken"), to [prefilters](http://api.jquery.com/extending-ajax/#Prefilters) (explained below), and even more!
 
 ### Serialization
-Serializing form inputs in jQuery is extremely easy. Two methods come supported natively — `$.fn.serialize` and `$.fn.serializeArray`. While the names are fairly self-explanatory, there are many advantages to using them.
 
-The `serialize` method serializes a form's data into a query string. For the element's value to be serialized, it **must** have a `name` attribute. Please note that values from inputs with a type of `checkbox` or `radio` are included only if they are checked.
+Serializing form inputs in jQuery is extremely easy. Two methods come supported natively: `.serialize()` and `.serializeArray()`. While the names are fairly self-explanatory, there are many advantages to using them.
+
+The `.serialize()` method serializes a form's data into a query string. For the element's value to be serialized, it **must** have a `name` attribute. Please note that values from inputs with a type of `checkbox` or `radio` are included only if they are checked.
 
 ```
 // Turning form data into a query string
@@ -21,7 +22,7 @@ $( "#myForm" ).serialize();
 // field_1=something&field2=somethingElse
 ```
 
-While plain old serialization is great, sometimes your application would work better if you sent over an array of objects, instead of just the query string. For that, jQuery has the `serializeArray` method. It's very similar to the `serialize` method listed above, except it produces an array of objects, instead of a string.
+While plain old serialization is great, sometimes your application would work better if you sent over an array of objects, instead of just the query string. For that, jQuery has the `.serializeArray()` method. It's very similar to the `.serialize()` method listed above, except it produces an array of objects, instead of a string.
 
 ```
 // Creating an array of objects containing form data

page/ajax/jquery-ajax-methods.md

@@ -6,19 +6,19 @@ attribution:
     - jQuery Fundamentals
 ---
 While jQuery does offer many Ajax-related convenience methods, the core
-`$.ajax` method is at the heart of all of them, and understanding it is
+`$.ajax()` method is at the heart of all of them, and understanding it is
 imperative. We'll review it first, and then touch briefly on the convenience
 methods.
 
-I generally use the `$.ajax` method and do not use convenience methods. As
+I generally use the `$.ajax()` method and do not use convenience methods. As
 you'll see, it offers features that the convenience methods do not, and its
 syntax is more easily understandable, in my opinion.
 
-### `$.ajax`
+### `$.ajax()`
 
-jQuery's core `$.ajax` method is a powerful and straightforward way of creating
+jQuery’s core `$.ajax()` method is a powerful and straightforward way of creating
 Ajax requests. It takes a configuration object that contains all the
-instructions jQuery requires to complete the request. The `$.ajax` method is
+instructions jQuery requires to complete the request. The `$.ajax()` method is
 particularly valuable because it offers the ability to specify both success and
 failure callbacks. Also, its ability to take a configuration object that can
 be defined separately makes it easier to write reusable code. For complete
@@ -27,7 +27,7 @@ documentation of the configuration options, visit
 documentation on api.jquery.com").
 
 ```
-// Using the core $.ajax method
+// Using the core $.ajax() method
 $.ajax({
 	// the URL for the request
 	url: "post.php",
@@ -71,9 +71,9 @@ you're asking for, and verify that the `Content-type` header is accurate for the
 data type. For example, for JSON data, the `Content-type` header should be
 `application/json`.
 
-### `$.ajax` Options
+### `$.ajax()` Options
 
-There are many, many options for the `$.ajax` method, which is part of its
+There are many, many options for the `$.ajax()` method, which is part of its
 power. For a complete list of options, visit
 [http://api.jquery.com/jQuery.ajax/](http://api.jquery.com/jQuery.ajax/ "$.ajax
 documentation on api.jquery.com"); here are several that you will use
@@ -101,7 +101,7 @@ the request.
 
 The scope in which the callback function(s) should run (i.e. what `this` will
 mean inside the callback function(s)). By default, `this` inside the callback
-function(s) refers to the object originally passed to `$.ajax`.
+function(s) refers to the object originally passed to `$.ajax()`.
 
 #### data
 
@@ -150,17 +150,17 @@ all browsers.
 
 The URL for the request.
 
-The `url` option is the only required property of the `$.ajax` configuration
+The `url` option is the only required property of the `$.ajax()` configuration
 object; all other properties are optional. This can also be passed as the first
-argument to `$.ajax`, and the options object as the second argument.
+argument to `$.ajax()`, and the options object as the second argument.
 
 ### Convenience Methods
 
-If you don't need the extensive configurability of `$.ajax`, and you don't care
+If you don't need the extensive configurability of `$.ajax()`, and you don't care
 about handling errors, the Ajax convenience functions provided by jQuery can be
 useful, terse ways to accomplish Ajax requests. These methods are just
-"wrappers" around the core `$.ajax` method, and simply pre-set some of the
-options on the `$.ajax` method.
+"wrappers" around the core `$.ajax()` method, and simply pre-set some of the
+options on the `$.ajax()` method.
 
 The convenience methods provided by jQuery are:
 
@@ -233,8 +233,8 @@ $.getJSON( "/details.php", function( resp ) {
 
 ### `$.fn.load`
 
-The `$.fn.load` method is unique among jQuery's Ajax methods in that it is
-called on a selection. The `$.fn.load` method fetches HTML from a URL, and
+The `.load()` method is unique among jQuery’s Ajax methods in that it is
+called on a selection. The `.load()` method fetches HTML from a URL, and
 uses the returned HTML to populate the selected element(s). In addition to
 providing a URL to the method, you can optionally provide a selector; jQuery
 will fetch only the matching content from the returned HTML.

page/effects/custom-effects.md

@@ -1,16 +1,16 @@
 ---
-title   : Custom Effects with $.fn.animate
+title   : Custom Effects with .animate()
 level: beginner
 source: http://jqfundamentals.com/legacy
 attribution:
     - jQuery Fundamentals
 ---
 jQuery makes it possible to animate arbitrary CSS properties via the
-`$.fn.animate` method. The `$.fn.animate` method lets you animate to a set
+`.animate()` method. The `.animate()` method lets you animate to a set
 value, or to a value relative to the current value.
 
 ```
-// Custom effects with $.fn.animate
+// Custom effects with .animate()
 $( "div.funtimes" ).animate({
 		left: "+=50",
 		opacity: 0.25
@@ -22,7 +22,7 @@ $( "div.funtimes" ).animate({
 });
 ```
 
-**Note:** Color-related properties cannot be animated with `$.fn.animate` using jQuery
+**Note:** Color-related properties cannot be animated with `.animate()` using jQuery
 out of the box. Color animations can easily be accomplished by including the
 [color plugin](http://github.com/jquery/jquery-color). We'll discuss using
 plugins later in the book.
@@ -35,7 +35,7 @@ jQuery includes only two methods of easing: swing and linear. If you want more
 natural transitions in your animations, various easing plugins are available.
 
 As of jQuery 1.4, it is possible to do per-property easing when using the
-`$.fn.animate` method.
+`.animate()` method.
 
 ```
 // Per-property easing

page/effects/intro-to-effects.md

@@ -5,7 +5,7 @@ level: beginner
 
 ## Showing and Hiding Content
 
-jQuery can show or hide content instantaneously with `$.fn.show` or `$.fn.hide`:
+jQuery can show or hide content instantaneously with `.show()` or `.hide()`:
 
 ```
 // Instantaneously hide all paragraphs
@@ -19,8 +19,8 @@ When jQuery hides an element, it sets its CSS `display` property to `none`. This
 zero width and height; it does not mean that the content will simply become transparent and leave an empty area on the page.
 
 jQuery can also show or hide content by means of animation effects. You can tell
-`$.fn.show` and `$.fn.hide` to use animation in a couple of ways. One is to pass
-in a string-valued argument of `slow`, `normal`, or `fast`:
+`.show()` and `.hide()` to use animation in a couple of ways. One is to pass
+in an argument of `'slow'`, `'normal'`, or `'fast'`:
 
 ```
 // Slowly hide all paragraphs
@@ -31,7 +31,7 @@ $( "div.hidden" ).show( "fast" );
 ```
 
 If you prefer more direct control over the duration of the animation effect, you
-can pass the desired duration in milliseconds to `$.fn.show` and `$.fn.hide`:
+can pass the desired duration in milliseconds to `.show()` and `.hide()`:
 
 ```
 // Hide all paragraphs over half a second
@@ -46,9 +46,9 @@ over the duration.
 
 ##Fade and Slide Animations
 
-You may have noticed that `$.fn.show` and `$.fn.hide` use a combination of slide and fade effects
+You may have noticed that `.show()` and `.hide()` use a combination of slide and fade effects
 when showing and hiding content in an animated way. If you would rather show or hide content with
-one effect or the other, there are additional methods that can help. `$.fn.slideDown` and `$.fn.slideUp`
+one effect or the other, there are additional methods that can help. `.slideDown()` and `.slideUp()`
 show and hide content, respectively, using only a slide effect. Slide animations are accomplished by
 rapidly making changes to an element's CSS `height` property.
 
@@ -60,7 +60,7 @@ $( "p" ).slideUp( 800 );
 $( "div.hidden" ).slideDown( 600 );
 ```
 
-Similarly `$.fn.fadeIn` and `$.fn.fadeOut` show and hide content, respectively, by means of a fade
+Similarly `.fadeIn()` and `.fadeOut()` show and hide content, respectively, by means of a fade
 animation. Fade animations involve rapidly making changes to an element's CSS `opacity` property.
 
 ```
@@ -73,9 +73,9 @@ $( "div.hidden" ).fadeIn( 750 );
 
 ##Changing Display Based on Current Visibility State
 
-jQuery can also let you change a content's visibility based on its current visibility state. `$.fn.toggle`
+jQuery can also let you change a content's visibility based on its current visibility state. `.toggle()`
 will show content that is currently hidden and hide content that is currently visible. You can pass the
-same arguments to `$.fn.toggle` as you pass to any of the effects methods above.
+same arguments to `.toggle()` as you pass to any of the effects methods above.
 
 ```
 // Instantaneously toggle the display of all paragraphs
@@ -88,8 +88,8 @@ $( "img" ).toggle( "slow" );
 $( "div" ).toggle( 1800 );
 ```
 
-`$.fn.toggle` will use a combination of slide and fade effects, just as `$.fn.show` and `$.fn.hide` do. You can
-toggle the display of content with just a slide or a fade using `$.fn.slideToggle` and `$.fn.fadeToggle`.
+`.toggle()` will use a combination of slide and fade effects, just as `.show()` and `.hide()` do. You can
+toggle the display of content with just a slide or a fade using `.slideToggle()` and `.fadeToggle()`.
 
 ```
 // Toggle the display of all ordered lists over 1 second using slide up/down animations
@@ -109,10 +109,10 @@ chain will wait until the animation runs to completion.
 $( "p.hidden" ).fadeIn( 750 ).addClass( "lookAtMe" );
 ```
 
-It is important to realize that `$.fn.fadeIn` above only *kicks off* the animation. Once started, the
+It is important to realize that `.fadeIn()` above only *kicks off* the animation. Once started, the
 animation is implemented by rapidly changing CSS properties in a JavaScript `setInterval()` loop. When
-you call `$.fn.fadeIn`, it starts the animation loop and then returns the jQuery object, passing it along
-to `$.fn.addClass` which will then add the `lookAtMe` style class while the animation loop is just
+you call `.fadeIn()`, it starts the animation loop and then returns the jQuery object, passing it along
+to `.addClass()` which will then add the `lookAtMe` style class while the animation loop is just
 getting started.
 
 To defer an action until after an animation has run to completion, you need to use an animation callback
@@ -151,9 +151,9 @@ if ( $someElement.length ) {
 
 jQuery provides some additional features for controlling your animations:
 
-### `$.fn.stop`
+### `.stop()`
 
-`$.fn.stop` will immediately terminate all animations running on the elements in your selection. You might give
+`.stop()` will immediately terminate all animations running on the elements in your selection. You might give
 end-users control over page animations by rigging a button they can click to stop the animations.
 
 ```
@@ -166,9 +166,9 @@ $( "input" ).attr({
 }).appendTo( document.body );
 ```
 
-### `$.fn.delay`
+### `.delay()`
 
-`$.fn.delay` is used to introduce a delay between successive animations. For example:
+`.delay()` is used to introduce a delay between successive animations. For example:
 
 ```
 // Hide all level 1 headings over half a second; then wait for 1.5 seconds

page/events/event-basics.md

@@ -16,8 +16,8 @@ In some cases, such as the page load and unload events, the browser itself will
 trigger the event.
 
 jQuery offers convenience methods for most native browser events. These methods —
-including `$.fn.click`, `$.fn.focus`, `$.fn.blur`, `$.fn.change`, etc. — are shorthand
-for jQuery's `$.fn.on` method. The `on` method is useful for binding the same handler
+including `.click()`, `.focus()`, `.blur()`, `.change()`, etc. — are shorthand
+for jQuery's `.on()` method. The on method is useful for binding the same handler
 function to multiple events, when you want to provide data to the event hander,
 when you are working with custom events, or when you want to pass an object of
 multiple events and handlers.
@@ -30,15 +30,15 @@ $( "p" ).click(function() {
 ```
 
 ```
-// Equivalent event setup using the `$.fn.on` method
+// Equivalent event setup using the `.on()` method
 $( "p" ).on( "click", function() {
 	console.log( "click" );
 });
 ```
 
 ### Extending Events to New Page Elements
 
-It is important to note that `$.fn.on` can only create event listeners
+It is important to note that `.on()` can only create event listeners
 on elements that exist *at the time you set up the listeners*. Similar elements created
 after the event listeners are established will not automatically pick up event behaviors
 you've set up previously. For example:
@@ -57,7 +57,7 @@ $( document ).ready(function(){
 });
 ```
 
-Consult the article on event delegation to see how to use `$.fn.on` so that
+Consult the article on event delegation to see how to use `.on()` so that
 event behaviors will be extended to new elements without having to rebind them.
 
 ### Inside the Event Handler Function
@@ -85,7 +85,7 @@ The button or key that was pressed.
 Any data that was passed in when the event was bound. For example:
 
 ```
-// Event setup using the `$.fn.on` method with data
+// Event setup using the `.on()` method with data
 $( "input" ).on(
 	"change",
 	{ foo: "bar" }, // associate data with event binding
@@ -141,7 +141,7 @@ $( "a" ).click(function( eventObject ) {
 
 Quite often elements in your application will be bound to multiple events. If
 multiple events are to share the same handling function, you can provide the event types
-as a space-separated list to `$.fn.on`:
+as a space-separated list to `.on()`:
 
 ```
 // Multiple events, same handler
@@ -153,7 +153,7 @@ $( "input" ).on(
 );
 ```
 
-When each event has its own handler, you can pass an object into `$.fn.on` with one or
+When each event has its own handler, you can pass an object into `.on()` with one or
 more key/value pairs, with the key being the event name and the value being the function
 to handle the event.
 
@@ -180,7 +180,7 @@ $( "p" ).off( ".myNamespace" ); // unbind all events in the namespace
 
 ### Tearing Down Event Listeners
 
-To remove an event listener, you use the `$.fn.off` method and pass in
+To remove an event listener, you use the `.off()` method and pass in
 the event type to off. If you attached a named function to the event, then
 you can isolate the event tear down to just that named function by passing it as the
 second argument.
@@ -203,7 +203,7 @@ $( "p" ).off( "click", bar ); // foo is still bound to the click event
 
 Sometimes you need a particular handler to run only once — after that, you may
 want no handler to run, or you may want a different handler to run. jQuery
-provides the `$.fn.one` method for this purpose.
+provides the `.one()` method for this purpose.
 
 ```
 // Switching handlers using the `$.fn.one` method
@@ -221,10 +221,10 @@ Note that in the code snippet above, the `firstClick` function will be executed
 the first click on *each* paragraph element rather than the function being removed from
 *all* paragraphs when *any* paragraph is clicked for the first time.
 
-`$.fn.one` can also be used to bind multiple events:
+`.one()` can also be used to bind multiple events:
 
 ```
-// Using $.fn.one to bind several events
+// Using .one() to bind several events
 $( "input[id]" ).one( "focus mouseover keydown", firstEvent);
 
 function firstEvent( eventObject ) {

page/events/event-helpers.md

@@ -7,14 +7,14 @@ attribution:
 ---
 jQuery offers two event-related helper functions that save you a few keystrokes.
 
-### `$.fn.hover`
+### `.hover()`
 
-The `$.fn.hover` method lets you pass one or two functions to be run when the
+The `.hover()` method lets you pass one or two functions to be run when the
 `mouseenter` and `mouseleave` events occur on an element. If you pass one
 function, it will be run for both events; if you pass two functions, the first
 will run for `mouseenter`, and the second will run for `mouseleave`.
 
-**Note:** Prior to jQuery 1.4, the `$.fn.hover` method required two functions.
+**Note:** Prior to jQuery 1.4, the `.hover()` method required two functions.
 
 ```
 // The hover helper function
@@ -23,11 +23,11 @@ $( "#menu li" ).hover(function() {
 });
 ```
 
-### `$.fn.toggle`
+### `.toggle()`
 
-The `$.fn.toggle` method is triggered by the "click" event and accepts two or
+The `.toggle()` method is triggered by the "click" event and accepts two or
 more functions. Each time the click event occurs, the next function in the
-list is called. Generally, `$.fn.toggle` is used with just two functions;
+list is called. Generally, `.toggle()` is used with just two functions;
 however, it will accept an unlimited number of functions. Be careful, though:
 providing a long list of functions can be difficult to debug.