Question

Seriously. The simplest jQuery code ever simply isn’t working.

<script type="text/javascript">
$(document).ready(function(){

 $('.codeswitcher').click(function() {
        alert("You clicked it");
 });

});
</script>

And then, in my page structure, I have this:

<div class="codeswitcher">
<img src="http://mysite.com/images/codeswitcher.png" alt="codeswitcher">
</div>

It’s just a 32x32px image. And you can click it. But nothing happens! 🙁 I’ve also changed my jQuery selector to .codeswitcher img and div.codeswitcher, but still nothing.

I have other jQuery code also running on the page just fine. What’s going wrong?

Thanks!

Jack

Answer 1

First, you’re not crazy, your example code works: http://jsfiddle.net/c3e6X/

Check to see if you have a JavaScript error before this code runs, just open the console and look.

If it’s created dynamically, e.g. AJAX then you should use .live() instead, like this:

$(function() {
  $('.codeswitcher').live('click', function() {
    alert("You clicked it");
  });
});