determine which child element was clicked by parent event handler
<p>two click handling functions</p>

<pre><code>$('#current_options').on('click', 'td', function(){
    $('#product_options_list tbody').css('display', 'none');
    $('.sub_options tbody').css('display', '');
    var my_id = $(this).parent().find('input').val();
    $('#product_options_list thead').css('display', '');
    $('#product_options_list tbody#'+my_id).css('display', '');
});

$('#current_options').on('click', '.icon-minus-sign', function(e){
    e.preventDefault();
    var rem_id = $(this).parent().find('input').val();

    //remove corresponding option values
    $('#product_options_list tbody#'+rem_id).remove();

    //either highlight next options values or hide table header if no other values present          
    $('#product_options_list thead').css('display', 'none');
    $(this).parent().parent().remove();


});
</code></pre>

<p>html </p>

<pre><code>&lt;table id="current_options" class="table"&gt;
   &lt;tbody&gt;
      &lt;tr&gt;
         &lt;td&gt;
            Size&lt;i class="icon-minus-sign"&gt;&lt;/i&gt;
         &lt;/td&gt;
</code></pre>

<p>basically, I want to stop the click handler on the td from firing if the click handler on the i inside the td is clicked.</p>
