jQuery, click element inside clickable element

Question

I have HTML syntax as followed :

<table>
  <tr>
    <td id="click1">
      <a href="somelink.html" id="click2">
        here's the link
      </a>
    </td>
  </tr>
</table>

and I have jquery syntax like this

$('td#click1').ajaxify();
$('a#click2').fancybox();

My problem is, if I click the #click2 then the #click1 is selected too.

How can I make it only select #click2 without calling #click1?

Answer 1

$('a#click2').click(function(event){

    event.stopPropagation();

})

you can call stopPropagation, to prevent event bubbling up the DOM tree.