Question

I had the following JavaScript code and it worked correctly –

var changeImageButton = document.getElementById("changeImageButton");
changeImageButton.onclick = buttonWasClicked;

‘buttonWasClicked’ is the name of the JavaScript function that gets called when the “changeImageButton” is clicked.

Now, I want to write the same code using JQuery. So I wrote –

 $("#changeImageButton").attr("onclick","buttonWasClicked");

But it is not working. What am I doing wrong?

Answer 1

You can achieve this using a few different methods

$("#changeImageButton").click(function(){ do_something(); });

$("#changeImageButton").on("click mouseover", function(){ do_something(); });
//this is useful because you can specify more than one event, if you want to
//(so, this code would also trigger when you move the mouse over - not what
// you want, but just for demonstration purposes)

//In jQuery 1.7+ this is doubly useful, because this will also work with elements
//added _after_ the DOM has initially loaded and this code has run