jQuery delegate() Method

jQuery delegate() method is used to attaches one or more event handlers for specific elements that are child of selected elements. And when the delegate event occurs, specified function will execute.

The delegate() method was deprecated in jQuery 3.0. Use the on() method instead of this.

Syntax

This syntax represent to the delegate event

$(selector).delegate(childSelector, eventType, eventData, function);

Parameter	Type	Description
childSelector	String	Required. Specifies one or more child elements to attach the event handler
eventType	String	Required. Specifies one or more DOM event types (such as "click" or "dblclick" or custom event names) to attach to the elements
eventData	Object	Optional. Specifies additional data that will be passed to the event handler
function	Function	Optional. Specifies the function to execute when the event is occurs

Example

This example represent to the double click event trigger on the selected elements.

<!DOCTYPE html>
<html>
<head>
  <title>jQuery delegate() method</title>
  <script src="jquery-latest.min.js"></script>
  <script>
    $(document).ready(function(){
      $( "div" ).delegate( "span", "click", function() {
        $( this ).after( "<p>Paragraph clicked</p>" );
      });
    });
  </script>
  <style>
    span {
      cursor: pointer;
    }
    p {
      color: red;
    }
  </style>
</head>
<body>
  <div>
    <span>First paragraph text</span>
  </div>
</body> 
</html>

Run it... »