What is the use of delegate() method in jQuery ? Last Updated : 29 Mar, 2022 Summarize Comments Improve Suggest changes Share Like Article Like Report jQuery is an open-source JavaScript library that simplifies the interactions between an HTML/CSS document, or more precisely the Document Object Model (DOM), and JavaScript. Elaborating the terms, simplifies HTML document traversing and manipulation, browser event handling, DOM animations, Ajax interactions, and cross-browser JavaScript development. The delegate() Method in jQuery is used to add event handlers to the element that are children of selected elements. When the event occurs then the function will be run. This will work for current and future elements (if we want to create some elements later). Syntax: $(selector) .delegate(childSelector, event, data, function) Parameters: This function accepts four parameters. childSelector: This is a required parameter and it is used to specify the children to attach the event handler.event: This is a required parameter and it is used to specify the events to attach to the elements. If there are multiple event values then they will be separated by space.data: This is an optional parameter and it is used to pass the extra data using the function.function: This is a required parameter and it specifies the function to run when the event occurs. Example: The following code demonstrates the delegate() method in jQuery. HTML <!DOCTYPE html> <html> <head> <title> delegate() Method in jQuery </title> <script src= "https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"> </script> </head> <body> <center> <h1 style="color: green;"> GeeksforGeeks </h1> <h2>delegate() Method in jQuery</h2> <div> <h3> Click the button to change font size, text color and background color of GeeksforGeeks </h3> <button> Click me </button> </div> <p>GeeksforGeeks</p> </center> <script> $(document).ready(function() { $("div").delegate("button", "click", function() { $("p").css("background-color", "grey"); $("p").css("color", "white"); $("p").css("font-size", "50px"); }); }); </script> </body> </html> Output: delegate() method in jQuery Reference: https://api.jquery.com/delegate/ Comment More infoAdvertise with us Next Article What is the use of html() method in jQuery ? S singh_teekam Follow Improve Article Tags : Web Technologies JQuery jQuery-Methods jQuery-Questions Similar Reads What is the use of html() method in jQuery ? The html() method in jQuery is used to get the contents of the first element in the set of matched elements or is used to set the HTML contents of every matched element. It returns the content of the first matched element. This function does not accept any arguments. Syntax: $(selector).html();Appro 4 min read What is the use of append() method in JQuery ? In this article, we are going to see how to use the append() method in jQuery. The append() method is used to insert new content inside an existing element. There are some other methods also that provide to insert new content inside an existing element and these are - prepend(), html(), text(), befo 2 min read What is the use of jQuery.ajax() method? AJAX is an important concept that must not be missed if you are learning front-end web development. It is an important aspect of the JavaScript programming language that allows the website to make requests to the server and exchange data without disturbing the page, that is without having it reload. 6 min read What is the use of param() method in jQuery ? In this article, we will learn about the param() method which is an inbuilt method provided by jQuery. This method is used for creating a serialized representation of an object. The method will recursively serialize deep objects for trying to work with modern languages like Ruby on Rails or Python. 3 min read What is the purpose of fadeToggle() method in JQuery ? In this article, we will see how to create a fadeToggle effect using jQuery. The fadeToggle effect can be created using fadeToggle() method.The fadeToggle() method is used to toggle between the fadeIn() and fadeOut() methods. If elements are faded in, fadeToggle() will fade out. If elements are fade 1 min read What is the use of .each() function in jQuery ? The each() function in jQuery iterate through both objects and arrays. Arrays that have length property are traversed from the index 0 to length-1 and whereas arrays like objects are traversed via their properties names. Syntax: $.each('array or object', function(index, value){ // Your code }) In th 2 min read Like