Learning jQuery 3 - Fifth Edition

Stopping event propagation

The event object provides the .stopPropagation() method, which can halt the bubbling process completely for the event. Like .target, this method is a basic DOM feature, but using the jQuery implementation will hide any browser inconsistencies from our code.

We'll remove the event.target == this check we just added, and instead add some code in our buttons' click handlers:

$(() => {  $('#switcher')    .click((e) => {      $(e.currentTarget)        .children('button')        .toggleClass('hidden');     }); }); $(() => {  $('#switcher-default')    .addClass('selected');   $('#switcher button')    .click((e) => {       const bodyClass = e.target.id.split('-')[1];       $('body')        .removeClass()        .addClass(bodyClass);       $(e.target)        .addClass('selected') .removeClass('selected'); ...