How to change the color of an element based on the section present below it?

 How to change the color of an element based on the section present below it.





function handleDarkSectionColors() {
        var section = $('.header-color-invert');
        var sectionClass;
        if (section.length) {
            var headerAlt = $('.header-bottom-bar');
            var self_window;
            $(window).on('scroll', function(){
                self_window = $(this);
                activeSection(self_window);
            });
            function activeSection(self_window) {
                var st = self_window.scrollTop() + (self_window.height() / 2) - 100;
                section.each(function(){
                    var sectionOffset = $(this).offset().top ;
                    var currentSection = $(this);
                    if (currentSection.hasClass('header-color-invert')) {
                        sectionClass = 'light-typo';
                    }
                    if (sectionOffset + currentSection.height() > st && st > sectionOffset) {
                        headerAlt.addClass(sectionClass);
                        return false;
                    } else {
                        headerAlt.removeClass(sectionClass);
                    }
                });
            }
        }
    }
handleDarkSectionColors();