Question

This simple jQuery code is not picking up clicks and I can’t understand why

$(document).ready(function(){  
 $("#piano").hide();
        $("#guitar").hide();
        $("#bass").hide();

                    console.log("E");
        $("#drumbtn").click(function() {
           alert("Handler for .click() called.");
      });

         $('#pianobtn').click(function () {
             $('#piano').show();
            $("#bass").hide();
            $("#drums").hide();
            $("#guitar").hide();

        });
        $("#guitarbtn").click(function () {
            $('#guitar').show();
            $("#bass").hide();
            $("#piano").hide();
            $("#drums").hide();

        });

        $("#bassbtn").click(function () {
                            $('#bass').show();
            $("#drums").hide();
            $("#piano").hide();
            $("#guitar").hide();

    });    });

Even the drumbtn alert is not working. I’m sure I’ve missed something simple

EDIT

HTML

 <ul>
    <li ><div id="drumbtn">Drums</div></li>
    <li ><div id="pianobtn">Piano</div></li>
    <li ><div id="guitarbtn">Guitar</div></li>
    <li ><div id="bassbtn">Bass Guitar</div></li>
 </ul>
<div id="mpc">

  <div class="wrapper" id="drums">
        DRUMS
  </div>

 <div class="wrapper" id="piano">
     PIANO
 </div>

<div class="wrapper" id="bass">
 BASS
 </div>

 <div class="wrapper" id="guitar">
     GUITAR
   </div>
</div>

Answer 1

Hey your code is absolutely right and its working for me.You need to import jquery library.download jquery-1.7.2.js file and place into your js folder and insert this line into your code.i hope it will also work for you.

<script type="text/javascript" src="js/jquery-1.7.2.js"></script>