Назначить класс на основе текущего div в верхней части страницы

Question

Я пытаюсь назначить класс элементу, когда раздел, проходящий через верх экрана, имеет класс 'dark' или 'light' - он работает, но только один раз. Любой совет, как я могу заставить его повторяться для каждого экземпляра?

var dark = $('.dark');
var light = $('.light');
$(window).scroll(function(){
    if ($(window).scrollTop() > dark.position().top) {
        $('#masthead').addClass('dark');
        $('#masthead').removeClass('light');
    } else if ($(window).scrollTop() > light.position().top) {
        $('#masthead').removeClass('dark');
        $('#masthead').addClass('light');
    }
});

Вот ссылка на JSFiddle .