Installation
CSS Selectors
Event Handling
DOM Manipulation
Utilities
Data Structures
AJAX APIs
Animation APIs
Widgets Creation
.on( "Event_Name", Listener_function ) - Attach an event
Events can be attached to elements ($.Objs) using ".on()" function
Parameters
NameTypeDefault ValuePossible ValuesDescription
Event_NameStringEvent NamesEvent name which has to be registered
Listener_functionfunctionanonymous functions or function referencesListener functions will be invoked when the event is triggered
Returns
NameTypeDescription
Event IDNumber.on() returns an event ID which can be used while removing or turning off the event
Example 1
Attaching a "click" event to div elements with a listener which shows an alert box
JS HTML CSS 
						$.domLoaded(function() {
						
							//Attach "click" event to div
							$.get("div").on("click", function() {
								alert("You Clicked on Div elements");
							});
							
						});						
						
<body>
Click On Us<br/>
	<div> Div 1 </div>
	<div> Div 2 </div>
	<div> Div 3 </div>
	<div> Div 4 </div>
</body>
		div {
			display : inline-block;
			width : 100px;
			height : 100px;
			border : 1px solid red;
		}
Result
Example 2
Attaching a "click" event to div elements with a listener using function reference
JS HTML CSS 
						$.domLoaded(function() {
						
							var listen_to_click = function() {
								alert("You Clicked on Div elements");
							}
							
							//Attach "click" event to div with function reference
							$.get("div").on("click", listen_to_click);
							
						});						
						
<body>
Click On Us<br/>
	<div> Div 1 </div>
	<div> Div 2 </div>
	<div> Div 3 </div>
	<div> Div 4 </div>
</body>
		div {
			display : inline-block;
			width : 100px;
			height : 100px;
			border : 1px solid red;
		}
Result