Problem with button click event in jquery

Question

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.

Answer 1

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.