Can I exclude a button click inside a TR click event?

Question

I am currently highlighting a table row when selected but in one of the cells I have a button. When I click the button I am triggering the table row click event. Is it possible to separate the two? My two calls currently look like this: ``` $('table.table-striped tbody tr').on('click', function () { $(this).find('td').toggleClass('row_highlight_css'); }); $(".email-user").click(function(e) { e.preventDefault(); alert("Button Clicked"); }); ``` My HTML looks like this: ```

col-1	col-2
Some Data

``` Any idea how I might stop the button click event from triggering the row click event?

Accepted Answer

You have to use `stopPropagation`:

```
$(".email-user").click(function(e) {
    e.preventDefault();
    e.stopPropagation();
    alert("Button Clicked");
});
```

(See also : What's the difference between event.stopPropagation and event.preventDefault?)

Can I exclude a button click inside a TR click event?

Solution

Problem

Related problems