JavaScript - onClick to get the ID of the clicked button

Question

How do find the id of the button which is being clicked?

Answer 1

How to do it without inline JavaScript

it is generally recommended to avoid inline JavaScript, but rarely is there an example of how to do it.
Here is my way of attaching events to buttons.
I'm not entirely happy with how much longer the recommended method is compared to a simple onClick attribute.

2014 browsers only

Button

2013 browsers only

Button 2



Button 4

Cross-browser

Button 2



Button 4

Cross-browser with jQuery

Button 2



Button 4

You can run this before the document is ready, clicking the buttons will work because we attach the event to the document.

Here is a jsfiddle
For some strange reason the insertHTML function does not work in it even though it works in all my browsers.

You can always replace insertHTML with document.write if you don't mind it's drawbacks

Sources:

• What are alternatives to document.write?
• Check if an element contains a class in JavaScript?
• event.preventDefault() function not working in IE
• https://gist.github.com/eduardocereto/955642