Click Tabs and Background changes (not BG of tab)

What I'm trying to accomplish:

When a tab is clicked background of parent div changes to a specific color.

My thinking for the jQuery code was to removeclass() (current class) and then add new class. But it seems I need to add a dynamic class because once li is clicked it'll change class, which is why I added an array of classes.

I think what would work best is targeting active class and then adding new class to div when "li" is "active".

But this is what I have right now:

jQuery Code:

    jQuery(document).ready(function(){

        var $tab1 = jQuery('#fusion-tab-design');
        var $tab2 = jQuery('#fusion-tab-seocontentcreation');
        var $tab3 = jQuery('#tab-f8bdac86ea321cb8b58');
        var $tab4 = jQuery('#tab-e7e9c83e3a31ecbd7c2');
        var $element_id = ["class1","class2","class3","class4"];

        var $bgCont = jQuery('#bgcoverchangey');
        var $currClass = $bgCont.attr('fusion-fullwidth fullwidth-box fusion-blend-mode changeme hundred-percent-fullwidth');

        // $bgCont.addClass('class1'); //starts with bg 1


            $tab1.click(function(){
                if($currClass != 'fusion fullwidth fullwidth box fusion blend mode changeme hundred percent fullwidth class1'){
                     $bgCont.removeAttr('fusion-fullwidth fullwidth-box fusion-blend-mode changeme hundred-percent-fullwidth' + $element_id);
                $bgCont.addClass(' class1');
                } else {
                    return false;
                };
            });

         $tab2.click(function(){
                if($currClass != 'fusion fullwidth fullwidth box fusion blend mode changeme hundred percent fullwidth class2'){
                     $bgCont.removeAttr('fusion-fullwidth fullwidth-box fusion-blend-mode changeme hundred-percent-fullwidth'+ $element_id);
                $bgCont.addClass(' class2');
                } else {
                    return false;
                };
            });

          $tab3.click(function(){
                if($currClass != 'fusion fullwidth fullwidth box fusion blend mode changeme hundred percent fullwidth class3'){
                     $bgCont.removeAttr('fusion-fullwidth fullwidth-box fusion-blend-mode changeme hundred-percent-fullwidth' + $element_id);
                $bgCont.addClass(' class3');
                } else {
                    return false;
                };
            });

          $tab4.click(function(){
                if($currClass != 'fusion fullwidth fullwidth box fusion blend mode changeme hundred percent fullwidth class4'){
                     $bgCont.removeAttr('fusion-fullwidth fullwidth-box fusion-blend-mode changeme hundred-percent-fullwidth' + $element_id);
                $bgCont.addClass(' class4');
                } else {
                    return false;
                };
            });

   }); 

CSS:

.class1:{
background-color:red;
}
.class2:{
background-color:yellow;
}
.class3{
background-color:green;
}
.class4{
background-color:orange;
}

The code I'm using seems an exaggeration to something that may take less code.