jQuery on() with Examples


The on() method in jQuery is used to attach event handlers to elements.

Syntax

The syntax is as follows −

$(selector).on(event,childSelector,data,function,map)

Above, the event parameter specifies one or more events or namespaces to attach to the selected element(s), childSelector is used to specify that the event handler should be attached to the specified child elements. The function parameter is the function to run when the event triggers, whereas the map parameter is the event map.

Example

Let us now see an example to implement the jQuery on() method 

 Live Demo

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script>
   $(document).ready(function(){
      $("button").click(function(){
         $("p").css("font-size", "1.5em");
      });
   });
</script>
</head>
<body>
<h2>Demo Heading</h2>
<p>Click below button to change the font size.</p>
<button>Change</button>
</body>
</html>

Output

This will produce the following output −

Click the “Change” button to update the font size −

Updated on: 30-Dec-2019

133 Views

Kickstart Your Career

Get certified by completing the course

Get Started
Advertisements