> For the complete documentation index, see [llms.txt](https://jscula.gitbook.io/docs/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://jscula.gitbook.io/docs/events/event-listener/onclick.md).

# onClick

### Adding Click event

```javascript
$('.button').onClick(function(e){
//perform action here
this.width(500);
});

//(optionaly) passing other options to controll bubbles  
$('.button').onClick(function(e){
//perform action here
},{...});
```

### Use cases

Use `onClick()` to:

* Submit or save a user action.
* Open or close interface elements.
* Dismiss a notification or message.

### More examples

Show confirmation after a save action:

```javascript
$('#save').onClick(function() {
  $('#status').text('Changes saved.');
});
```

Toggle a navigation menu:

```javascript
$('#menu-toggle').onClick(function() {
  $('#menu').toggleClass('is-open');
});
```

Dismiss a notification:

```javascript
$('#dismiss-notice').onClick(function() {
  $('#notice').hide(200);
});
```