---
title: "What is event binding in jQuery?"  
description: "What is event binding in jQuery?"  
author: "Revati S Misra"  
published: 2023-05-09  
updated: 2023-05-15  
canonical: https://www.mindstick.com/forum/158239/what-is-event-binding-in-jquery  
category: "jquery"  
tags: ["jquery", "javascript", "javascript events"]  
reading_time: 3 minutes  

---

# What is event binding in jQuery?

What is [event binding](https://www.mindstick.com/forum/157865/how-does-knockoutjs-handle-events-and-event-binding) in jQuery?

## Replies

### Reply by Aryan Kumar

[Event](https://www.mindstick.com/articles/167719/marquee-hire-benefits-of-event-lighting-hire-london) [binding](https://www.mindstick.com/blog/146/dynamic-binding-in-c-sharp) in jQuery is the process of attaching a function to an event so that the function is called when the event occurs.

There are two ways to bind events in jQuery:

- **The .on() method**
- **The .bind() method**

The .on() method is the preferred method for binding events in jQuery. It is more flexible and powerful than the .bind() method.

The .on() method takes three arguments:

- The first argument is the event name.
- The second argument is the selector that identifies the elements that should be bound to the event.
- The third argument is the function that should be called when the event occurs.

For example, the following code binds an event handler to the click event for all elements with the class my-element:

Code snippet

```plaintext
$('.my-element').on('click', function() {
  // Do something when the element is clicked
});
```

The .bind() method is the older method for binding events in jQuery. It is less flexible and powerful than the .on() method.

The .bind() method takes four arguments:

- The first argument is the event name.
- The second argument is the element that should be bound to the event.
- The third argument is the function that should be called when the event occurs.
- The fourth argument is an object that can be used to customize the event binding.

For example, the following code binds an event handler to the click event for the element with the ID my-element:

Code snippet

```plaintext
$('#my-element').bind('click', function() {
  // Do something when the element is clicked
});
```

Once an event has been bound to an element, the function that was passed to the .on() or .bind() method will be called when the event occurs.

The function that is called when an event occurs is called the event handler. The event handler can be used to perform any action that you want when the event occurs.

For example, the following code uses an event handler to change the text of an element when it is clicked:

Code snippet

```plaintext
$('.my-element').on('click', function() {
  $(this).text('I was clicked!');
});
```

When the element with the class my-element is clicked, the text of the element will be changed to "I was clicked!".

Event binding is a powerful tool that can be used to make your JavaScript code more interactive. It allows you to attach functions to events so that your code can respond to user input and other events.


---

Original Source: https://www.mindstick.com/forum/158239/what-is-event-binding-in-jquery

Copyright © MindStick Software Pvt. Ltd. This Markdown version is provided for developers, AI systems, and offline reading.