calling a click event inside nested divs won't fire

Hi There,

I'm having some issues trying to fire click event using jquery. The event works fine if I move the image outside the nested divs but as soon as I put the image back the function just wont work.

Can someone help me out with the syntax please and help me get the id value from the object so I can send it with the ajax call.

Thanks in advance.

Sean

$(document).ready(function() {
  // Add the page method call as an onclick handler for the div.
  $("#slideShowHeader.numbdots.offer-buttons" ).click(function() {
    $.ajax({
      type: "POST",
      url: "mypage.aspx",
      data: "{}",
      contentType: "application/json; charset=utf-8",
      dataType: "json",
      success: function(msg) {
        // Replace the div's content with the page method's return.
        $("#Result").text(msg.d);
      }
    });
  });
});
 
 
 
<div id="slideShowHeader">
   
 <div id="numbdots">
     <img src="../images/4_Button.gif" id="one" alt="" class="offer-buttons"/>
 
  </div>
     
</div>

Select allOpen in new window