jQuery fn.extend() Method

Last Updated:

jQuery fn.extend() Method

The jQuery fn.extend() method is used to extend the jQuery.fn object, which adds several plugin functions in one go (instead of assigning each function separately).

Example

HTML Editor
<!DOCTYPE html> <html lang="en-US"> <head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> </head> <body> <h1>jQuery.fn.extend() Method</h1> <p>Click on the button to affect this paragraph</p> <button>Click Me</button> <script> $(document).ready(function(){ $("button").click(function(){ jQuery.fn.extend({ myStyle: function(){ this.css({ "color": "red", "font-size": "20px", "font-style": "italic" }); } }); $("p").myStyle(); }); }); </script> </body> </html>

Syntax

$.fn.extend(obj);

Parameter Values

Value Type Explanation
obj Required Specifies an object to merge onto the jQuery prototype.

Browser Support

Devicedesktopmobile
Browsergoogle chromesafarifirefoxinternet Exploreredgeoperagoogle chromesafarifirefoxedgeoperaandroid webviewsamsung internet
fn.extend()YesYesYesYesYesYesYesYesYesYesYesYesYes

Share this Page

Meet the Author