CODEWITHSUNDEEP
jquerybuttonhtmlclick
Rahul Singh
Rahul Singh

Reputation: 1632

Problem with button click event in jquery

I am using jQuery on button click to show div but don't know why its not working...

HTML:

<input type="button" id="addmoresg" value="Add More" name="button">
<div id="addsg" style="display:none">
    <!-- more HTML here -->
</div>

JavaScript:

$(document).ready(function() {
    $('.addmoresg').click(function() {
        $('.addsg').show("slow");
    });
});

jsFiddle demo: http://jsfiddle.net/XGVp3/

I am not getting any result on button click.

Upvotes: 6

Views: 15482

Answers (2)

mliya
mliya

Reputation: 21

just change your code as:

$(document).ready(function() {
    $('#addmoresg').click(function() {
        $('#addsg').show("slow");
    });
});

Basically, you were targeting the class adddsg (done by a .class). Since the div has and ID of adddsg, you need to target using #ID

Hope that helps.

Upvotes: 0

Felix Kling
Felix Kling

Reputation: 816590

2 problems:

  1. You did not select jQuery as library in your demo.

  2. You use class selectors [docs] (.addmoresg) instead of id selectors [docs] (#addmoresg). Your elements only have ids, not classes:

    <input type="button" id="addmoresg" value="Add More" name="button">

    $('.addmoresg) would select elements with class="addmoresg", e.g.

    <input type="button" class="addmoresg" value="Add More" name="button">

Working demo

jQuery has a great documentation and a list of all possible selectors, with examples.

Upvotes: 8

Related Questions