jQuery onClick event

Question

Cant seem to get this working. Any help would be great. I am somewhat of a beginner with jquery.

$('#add_button').click(function () {
    $("#add_button").hide();
});

Here is the HTML

<input id='add_button' type='submit' class='add_now' value='' />

Seems simple enough, but clicking on the input does nothing. Is there a different method for targeting inputs? Thanks.

Answer 1

Make sure you include jQuery before your script:

<script src="http://code.jquery.com/jquery-latest.js"></script>

And put your code inside a document-ready function:

$(document).ready(function () {
    $('#add_button').click(function () {
        $("#add_button").hide();
    });
});

Answer 2

Return false from your function.

Answer 3

You should add return false; to prevent the browser's default action.

Answer 4

The problem might be that your jQuery is above the form. Try to move it below your HTML.