Listing 3.14: factor button click handling.

Chapter 3/03.js

@@ -1,10 +1,11 @@
 $(document).ready(function () {
   'use strict';
 
-  $('#switcher h3').hover(
-    function () { $(this).addClass('hover'); },
-    function () { $(this).removeClass('hover'); }
-  );
+  $('#switcher h3').hover(function() {
+    $(this).addClass('hover');
+  }, function() {
+    $(this).removeClass('hover');
+  });
 });
 
 $(document).ready(function () {
@@ -20,18 +21,15 @@ $(document).ready(function () {
 
   $('#switcher-default').addClass('selected');
 
-  // Automatic handler names available for (jQuery 1.9.0):
-  // blur focus focusin focusout load resize scroll unload click dblclick.
-  // mousedown mouseup mousemove mouseover mouseout mouseenter mouseleave
-  // change select submit keydown keypress keyup error contextmenu.
-  $('#switcher button').click(function (event) {
-    var bodyClass = this.id.split('-')[1];
+  $('#switcher').click(function (event) {
+    if ($(event.target).is('button')) {
+      var bodyClass = event.target.id.split('-')[1];
 
-    $('body').removeClass().addClass(bodyClass);
+      $('body').removeClass().addClass(bodyClass);
 
-    $('#switcher button').removeClass('selected');
-    $(this).addClass('selected');
-    event.stopPropagation();
+      $('#switcher button').removeClass('selected');
+      $(event.target).addClass('selected');
+      event.stopPropagation();
+    }
   });
-
-});
+});