how can i get rid of duplication in this code

serv

New Member
I have $(this).css() a lot in my code...im new to JS so I'm not sure what the best way to remove this duplication and make my code clean... here is the link to my fiddle http://jsfiddle.net/d0okie0612/7Y2Qp/ \[code\] $(".btn-pvPanels").on('click', function(event) { var selected; selected = $(this).val(); if(selected === "on-panel") { $(this).css({ 'background': 'orange', 'color': 'white' }); $(this).parent().find('.btn-off').css({ 'background': '#F1F1F1', 'color': '#8E8D8D' }); $('.aon_poff').fadeIn('slow'); } else if(selected === "off-panel") { $(this).css({ 'background': 'orange', 'color': 'white' }); $(this).parent().find('.btn-on').css({ 'background': '#F1F1F1', 'color': '#8E8D8D' }); $('.aon_poff').fadeOut('slow'); }else if(selected === "on-accessories") { $(this).css({ 'background': 'orange', 'color': 'white' }); $(this).parent().find('.btn-on').css({ 'background': '#F1F1F1', 'color': '#8E8D8D' }); }else if(selected === "on-accessories" && "on-panel") { $(this).css({ 'background': 'orange', 'color': 'white' }); $(this).parent().find('.btn-on').css({ 'background': '#F1F1F1', 'color': '#8E8D8D' }); alert('hey') }}); $(".btn-accessories").on('click', function(event) {var selected;selected = $(this).val();if(selected === "on-accessories") { $(this).css({ 'background': 'orange', 'color': 'white' }); $(this).parent().find('.btn-off').css({ 'background': '#F1F1F1', 'color': '#8E8D8D' }); $('.aoff_pon').fadeIn('slow'); } else if(selected === "off-accessories") { $(this).css({ 'background': 'orange', 'color': 'white' }); $(this).parent().find('.btn-on').css({ 'background': '#F1F1F1', 'color': '#8E8D8D' }); $('.aoff_pon').fadeOut('slow'); }});\[/code\]
 
Back
Top