# Adding event handlers to sketch
**URL:** https://discourse.processing.org/t/adding-event-handlers-to-sketch/21863
**Category:** Development
**Created:** [June 14, 2020, 1:05pm UTC](https://discourse.processing.org/t/adding-event-handlers-to-sketch/21863 "2020-06-14T13:05:33Z")
**Posts on this page:** 4
**Page:** 1
### Author:  [@Jithin](https://discourse.processing.org/u/Jithin)
#### Post date: [June 14, 2020, 1:05pm UTC](https://discourse.processing.org/t/adding-event-handlers-to-sketch/21863/1 "2020-06-14T13:05:33Z")
Hi I’m trying to create a library that extends p5. I want to add event handlers to the sketch. I tried to use \_onmousedown event present in p5 prototype, but its giving me an errror. How can I achieve this?
I could just attach an event listener to document. But is there a more elegant way of doing this?
---
### Author:  [@GoToLoop](https://discourse.processing.org/u/GoToLoop)
#### Post date: [June 14, 2020, 5:51pm UTC](https://discourse.processing.org/t/adding-event-handlers-to-sketch/21863/2 "2020-06-14T17:51:37Z")
> [@Jithin](#):
>
> I want to add event handlers to the sketch.
- I believe you meant the sketch’s main canvas, right?
- You can access the main canvas via the hidden/undocumented/private properties p5::_\_renderer_ or p5::_\_curElement_.
- From there, given it’s of datatype p5.Renderer: [reference | p5.js](http://p5js.org/reference/#/p5.Renderer)
- You can invoke its parent datatype p5.Element’s methods: [reference | p5.js](http://p5js.org/reference/#/p5.Element)
- Such as p5.Element::**mousePressed()**: [reference | p5.js](http://p5js.org/reference/#/p5.Element/mousePressed)
- Or alternatively via property p5.Element::_elt_: [reference | p5.js](http://p5js.org/reference/#/p5.Element/elt)
---
### Author:  [@Jithin](https://discourse.processing.org/u/Jithin)
#### Post date: [June 19, 2020, 7:34am UTC](https://discourse.processing.org/t/adding-event-handlers-to-sketch/21863/5 "2020-06-19T07:34:17Z")
One more doubt, Does mousePressed support multiple event handlers? I.e Can we call mousePressed multiple times to attach multiple call back functions?
---
### Author:  [@GoToLoop](https://discourse.processing.org/u/GoToLoop)
#### Post date: [June 19, 2020, 8:06am UTC](https://discourse.processing.org/t/adding-event-handlers-to-sketch/21863/6 "2020-06-19T08:06:18Z")
> [@Jithin](#):
>
> Does **mousePressed()** support multiple event handlers?
It seems indeed if we call method p5::**mousePressed()** multiple times it would replace its previous callback w/ the current 1.
If you need a p5.Element to have multiple callbacks for the same event you’re gonna need to call method EventTarget::**addEventListener()** over its property p5.Element::_elt_:
> **[EventTarget: addEventListener() method - Web APIs | MDN](https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener)**
>
> The addEventListener() method of the EventTarget interface
> sets up a function that will be called whenever the specified event is delivered to the target.