jQuery how to stop triggered click event from bubbling

event-bubbling, jquery, stoppropagation

Solution

You need to have a bound event to the child elements:

$('.panel-select').click(function() {
   $(this).children('input').trigger('click');
});

// try adding to the below event not on the parent.

$('.panel-select input').click(function(e) {
    e.stopPropagation();
});

Problem

I had this code: ``` $('.panel-select').click(function() { $(this).children('input').trigger('click'); }); ``` But I got a RangeError: Maximum call stack size exceeded. I googled some and found out that the event bubbles up in the DOM. I'm trying to stop it but I'm not succeeding. I tried this: ``` $('.panel-select').click(function(e) { e.stopPropagation(); $(this).children('input').trigger('click'); }); ``` But it's not working. How should I do this?

Original source