How to remove "old" header area

I keep my holidays in an array and code the header area as per the documentation for coloring holidays. The user can change the list of holidays. When I then reload the holidays with the new days the old holiday header areas remain. I have tried various approaches but none seems to work. My last attempt:

function BeforeTimeHeaderRender (args) {
    if (args.header.level === 1) {
        var dayOfWeek = args.header.start.getDayOfWeek();
        var item = globalHolidays.find(function(range) {
          var start = new DayPilot.Date(range.start);
          var end = new DayPilot.Date(range.end).addDays(1);
          return DayPilot.Util.overlaps(start, end, args.header.start, args.header.end);
        });

        if (item) {
          var start = new DayPilot.Date(item.start);
          var end = new DayPilot.Date(item.end).addDays(1);
          args.header.areas = [
            {
              ... set area here
            }
          ];
        } else if(args.header.areas?.length > 0){
            args.header.areas = undefined;
            //args.header.areas = [];
        //} else if(args.header.areas !== undefined){
            //args.header.areas = undefined;
            //args.header.areas = [];
        }
    } 
}