$(document).ready(function () { 'use strict'; $('#switcher ').hover(function() { $(this).addClass('hover'); }, function() { $(this).removeClass('hover'); }); }); $(document).ready(function () { 'use strict'; var toggleSwitcher = function(event) { if (!$(event.target).is('button')) { $('#switcher button').toggleClass('hidden'); } }; $('#switcher').on('click', toggleSwitcher); $('#switcher').click(); $('#switcher button').click(function () { $('#switcher').off('click', toggleSwitcher); if (this.id === 'switcher-default') { $('#switcher').on('click', toggleSwitcher); } }); }); $(document).ready(function () { 'use strict'; $('#switcher-default').addClass('selected'); $('#switcher').click(function(event) { if ($(event.target).is('button')) { var bodyClass = event.target.id.split('-')[1]; $('body').removeClass().addClass(bodyClass); $('#switcher button').removeClass('selected'); $(event.target).addClass('selected'); } }); });