jQuery maphighlight for changing area highlight color based on condition

See more:

ASP.NET

jQuery

I have created Image Map using map co-ordinates and have to highlighted co-ordinates, which is working fine but what i need is, To change the highlight color depends upon the condition...In first condtion highlight the area with the red color then the same area will be highlighted with the black color for the second condition.I can able to highlight the same area but i cant able to change the color of the area simultaneously.

My Sample Code on Fiddle Here : Fiddle Demo

I have tried using

<script>
            $(document).ready(function () //on page load
            {
                $('area[title*="UPPER"]').each(function ()//get all areas
                {
                    $(this).addClass("victory");
                });
    
                $('area[title*="LOWER"]').each(function ()//get all areas
                {
                    $(this).addClass("lose");
                });
    
                //initialize highlight
                $('.map').maphilight({ strokeWidth: 0, fillColor: "0000FF", fillOpacity: 0.8, singleSelect: true });
    
                ////map wrap
                $(".victory").click(function () {                
                    //This block is what creates highlighting by trigger the "alwaysOn", 
                    var data = $(this).data('maphilight') || {};
                    data.alwaysOn = !data.alwaysOn;
                    $(this).data('maphilight', data).trigger('alwaysOn.maphilight');
                    //there is also "neverOn" in the docs, but not sure how to get it to work
                });
    
                $('.map').maphilight({ strokeWidth: 0, fillColor: "FFFF00", fillOpacity: 0.8});
    
                $(".lose").click(function () {                
                    //This block is what creates highlighting by trigger the "alwaysOn", 
                    var data = $(this).data('maphilight') || {};
                    data.alwaysOn = !data.alwaysOn;
                    $(this).data('maphilight', data).trigger('alwaysOn.maphilight');
                    //there is also "neverOn" in the docs, but not sure how to get it to work
                });
            });
        </script>

Fiddle Demo

but which is overwrite the first fillcolor with second fillcolor.any one help me to resolve this problem.