click event on an image inside a span is not working

Question

Can I put an image inside a span and give click event to the span using jQuery. Here it is not working in my code have any idea.

<span id="removeNewTime" class="removeTime">
    <img src="Images/close button.png" alt="close" />
</span>

jQuery code

<script>
    $(document).ready(function(){
        $(".removeTime").click(function(){
            alert("hello");
        });
    });
</script>

Answer 1

It is work you might need to include jQuery, This post tell how to add jQuery on page.

Live Demo

$(document).ready(function(){
    $(".removeTime").click(function(){
     alert("hello");
    });
});​

Answer 2

Either set your span's CSS to display:block; or replace the span with a <div>

Answer 3

Make sure you have jquery library included before any doc ready function applied:

see the working fiddle:

http://jsfiddle.net/87Laj/

<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js' type='text/javascript'></script>

<script>
   $(document).ready(function(){
     $(".removeTime").click(function(){
      alert("hello");
    });
  });
</script>

Answer 4

Make sure you have included jquery in the head section of your file. As the code is working fine.

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

This will ensure you always have the latest jquery file.

Answer 5

May be the problem in jquery file, which is required to jquery code to be working.

Check the working jsfiddle

Small improvements to js code:

$(function() {
    $(".removeTime").on('click', function(){
         alert("hello");
    });
});​

Answer 6

This code is working Notice some points in your code

1) Don't forget to add latest jquery file like http://code.jquery.com/jquery-1.8.3.min.js to your code.

2) Download from http://jquery.com/download/

Answer 7

some times i do like this its dosnt work,

then i try this (if page dynamically chenged befor)

$(document).ready(function(){
    $(".removeTime").live("click",function(){
     alert("hello");
    });
});​