Значение localStorage сохраняется и загружается правильно, но не применяется к вводу флажка

Я пытаюсь использовать localStorage для хранения и загрузки проверенного состояния флажка. Значения правильно сохраняются и извлекаются из localStorage, но флажок не отражает эти значения при загрузке страницы.

Вот краткое описание моего кода:

const driver = window.driver.js.driver;

const roleBasedSteps = {
    admin: {
        commonSteps: [
            {
                element: '#themeSwitchBtn',
                popover: {
                    title: 'Switch Theme',
                    description: `<p>Swtich between light and dark mode.</p>
                    <label><input type='checkbox' value='' class='startGuideOnLogin'> Always start guide on login</label>`,
                    position: 'auto'
                    // side: 'top', // left, top, right, bottom
                    // align: 'start' // start, center, end
                }
            },
            {
                element: '#navProfileBtn',
                popover: {
                    title: 'More Options',
                    description: 'More options to handle your profile.',
                    position: 'auto'
                }
            },
            {
                element: '#dashboardBtn',
                popover: {
                    title: 'Dashbaord',
                    description: 'Overview your overall progress in figures, charts and tables.',
                    position: 'auto'
                }
            },
            {
                element: '#emailBtn',
                popover: {
                    title: 'Email',
                    description: 'Email box where you can send, receive and read emails.',
                    position: 'auto'
                }
            },
            {
                element: '#usersDropdown',
                popover: {
                    title: 'Users List',
                    description: 'View all users list to manage them.',
                    position: 'auto'
                }
            }
        ],
        'index.php': [
            {
                element: '#adminDashboardCountStats',
                popover: {
                    title: 'Total Counts',
                    description: 'View all counts of meetings, clients, client interviews and placed clients.',
                    position: 'auto'
                }
            }
        ]
    },
    employee: {
        commonSteps: [
            {
                element: '#themeSwitchBtn',
                popover: {
                    title: 'Switch Theme',
                    description: 'Swtich between light and dark mode.',
                    position: 'auto'
                }
            },
            {
                element: '#navProfileBtn',
                popover: {
                    title: 'More Options',
                    description: 'More options to handle your profile.',
                    position: 'auto'
                }
            },
            {
                element: '#dashboardBtn',
                popover: {
                    title: 'Dashbaord',
                    description: 'Overview your overall progress in figures, charts and tables.',
                    position: 'auto'
                }
            },
            {
                element: '#emailBtn',
                popover: {
                    title: 'Email',
                    description: 'Email box where you can send, receive and read emails.',
                    position: 'auto'
                }
            },
            {
                element: '#usersDropdown',
                popover: {
                    title: 'Users List',
                    description: 'View all users list to manage them.',
                    position: 'auto'
                }
            }
        ],
        'index.php': [
            {
                element: '#employeeDashboardCountStats',
                popover: {
                    title: 'Total Counts',
                    description: 'View all counts of meetings, clients, client interviews and placed clients.',
                    position: 'auto'
                }
            }
        ]
    },
    candidate: {
        commonSteps: [
            {
                element: '#themeSwitchBtn',
                popover: {
                    title: 'Switch Theme',
                    description: 'Swtich between light and dark mode.',
                    position: 'auto'
                }
            },
            {
                element: '#navProfileBtn',
                popover: {
                    title: 'More Options',
                    description: 'More options to handle your profile.',
                    position: 'auto'
                }
            },
            {
                element: '#dashboardBtn',
                popover: {
                    title: 'Dashbaord',
                    description: 'Overview your overall progress in figures, charts and tables.',
                    position: 'auto'
                }
            },
            {
                element: '#emailBtn',
                popover: {
                    title: 'Email',
                    description: 'Email box where you can send, receive and read emails.',
                    position: 'auto'
                }
            },
            {
                element: '#jobsListBtn',
                popover: {
                    title: 'Jobs List',
                    description: 'View all listed jobs where you can check and give feedback to us.',
                    position: 'auto'
                }
            },
            {
                element: '#kanbanDropdown',
                popover: {
                    title: 'Interviews Board',
                    description: 'Mnanage your interviews and their progress.',
                    position: 'auto'
                }
            },
            {
                element: '#accountDropdown',
                popover: {
                    title: 'Account',
                    description: 'Manage your profile.',
                    position: 'auto'
                }
            },
            {
                element: '#calendarBtn',
                popover: {
                    title: 'Calendar',
                    description: 'View calendar and events.',
                    position: 'auto'
                }
            },
            {
                element: '#collapseBtn',
                popover: {
                    title: 'Collapse Sidebar',
                    description: 'Collapse sidebar menu.',
                    position: 'auto'
                }
            }
        ],
        'index.php': [
            {
                element: '#dashboardTotalCounts',
                popover: {
                    title: 'Total Counts',
                    description: 'View all counts of jobs, interviews and meetings.',
                    position: 'auto'
                }
            },
            {
                element: '#dashboardAppliedJobsCount',
                popover: {
                    title: 'Applied Jobs Graph',
                    description: 'View graphical representation below based on selected date range of applied jobs.',
                    position: 'auto'
                }
            },
            {
                element: '#dashboardInterviewsListTable',
                popover: {
                    title: 'Interviews List Table',
                    description: 'View tabular view of your interviews.',
                    position: 'auto'
                }
            }
        ],
        'email.php': [
            {
                element: '.composeEmailBtn',
                popover: {
                    title: 'Compose Email',
                    description: 'Opens compose emails section.',
                    position: 'auto'
                }
            },
            {
                element: '#emailSidebarSection',
                popover: {
                    title: 'Email Folders',
                    description: 'View emails in each folder.',
                    position: 'auto'
                }
            },
            {
                element: '#load-folder-emails',
                popover: {
                    title: 'Emails List',
                    description: 'View all emails of specific folder.',
                    position: 'auto'
                }
            }
        ],
        'jobs_list.php': [
            {
                element: '#jobsListPageSearch',
                popover: {
                    title: 'Search Job',
                    description: 'Search from jobs list.',
                    position: 'auto'
                }
            },
            {
                element: '#jobsListAction',
                popover: {
                    title: 'Give Rating',
                    description: 'Rate any job by clicking action button against the job.',
                    position: 'auto'
                }
            },
            {
                element: '#jobsListAction',
                popover: {
                    title: 'Give Review',
                    description: 'Review any job by clicking action button against the job.',
                    position: 'auto'
                }
            }
        ],
        'kanban.php': [
            {
                element: '#kanbanInterviews',
                popover: {
                    title: 'Pending Interviews',
                    description: 'Here is the list of all upcoming interviews.',
                    position: 'auto'
                }
            },
            {
                element: '#kanbanStage1',
                popover: {
                    title: 'First Stage',
                    description: 'Here is the list of interviews of first stage.',
                    position: 'auto'
                }
            },
            {
                element: '#kanbanStage2',
                popover: {
                    title: 'Second Stage',
                    description: 'Here is the list of interviews of second stage.',
                    position: 'auto'
                }
            },
            {
                element: '#kanbanRejected',
                popover: {
                    title: 'Rejected',
                    description: 'Here is the list of failed interviews.',
                    position: 'auto'
                }
            },
            {
                element: '#kanbanOffer',
                popover: {
                    title: 'Offer',
                    description: 'Here is the list of passed interviews.',
                    position: 'auto'
                }
            },
            {
                element: '.kanbanAddInterview1',
                popover: {
                    title: 'Add New',
                    description: 'Opens pop up to add new item.',
                    position: 'auto'
                }
            },
            {
                element: '.kanbanAddInterview2',
                popover: {
                    title: 'Add New',
                    description: 'Opens pop up to add new item.',
                    position: 'auto'
                }
            },
            {
                element: '.kanbanAddInterview3',
                popover: {
                    title: 'Add New',
                    description: 'Opens pop up to add new item.',
                    position: 'auto'
                }
            },
            {
                element: '.kanbanAddInterview4',
                popover: {
                    title: 'Add New',
                    description: 'Opens pop up to add new item.',
                    position: 'auto'
                }
            },
            {
                element: '.kanbanAddInterview5',
                popover: {
                    title: 'Add New',
                    description: 'Opens pop up to add new item.',
                    position: 'auto'
                }
            }
        ]
    }
};

function mergeGuideSteps(common, specific) {
    return [...common, ...specific];
}

const steps = mergeGuideSteps(roleBasedSteps[userRole].commonSteps, roleBasedSteps[userRole][currentPage]) || [];

function expandHiddenAreas(steps) {
    steps.forEach(step => {
        const element = document.querySelector(step.element);
        if (element) {
            let parent = element.parentElement;
            while (parent) {
                if (parent.style.display === 'none' || parent.style.visibility === 'hidden') {
                    parent.style.display = '';
                    parent.style.visibility = '';
                }
                if (parent.classList.contains('collapsed')) {
                    parent.classList.remove('collapsed');
                }
                parent = parent.parentElement;
            }
        }
    });
}

function isElementInCommonSteps(commonSteps, element) {
    const result = commonSteps.some(step => step.element === element);
    // console.info(`Checking if element ${element} is in common steps: ${result}`);
    return result;
}

function expandSidebarIfNeeded(commonSteps, currentElement) {
    const sidebar = document.querySelector('#navbarVerticalCollapse');
    const isMobileScreen = window.innerWidth <= 990;
    // console.info(window.innerWidth);

    const cElement = "#" + currentElement;

    if (isMobileScreen && isElementInCommonSteps(commonSteps, cElement)) {
        sidebar.classList.add('show');
    } else {
        sidebar.classList.remove('show');
    }
}

const driverObj = driver({
    showProgress: true,
    steps: steps,
    onHighlightStarted: (element) => {
        expandSidebarIfNeeded(roleBasedSteps[userRole].commonSteps, element.id);
    }
});

document.addEventListener('click', function (event) {
    if (event.target && event.target.classList.contains('startGuideOnLogin')) {
        const checked = '1';
        const unchecked = '0';

        if (event.target.value === '0' || event.target.value === '') {
            localStorage.setItem('startGuideOnLogin', checked);
            localStorage.setItem('startGuideBox', 'true');
            event.target.value = checked;
            event.target.checked = true;
        } else {
            localStorage.setItem('startGuideOnLogin', unchecked);
            localStorage.setItem('startGuideBox', 'false');
            event.target.value = unchecked;
            event.target.checked = false;
        }

        console.info('Checkbox value:', event.target.value);
    }
});

document.getElementById('startGuide').addEventListener('click', function () {
    expandHiddenAreas(steps);
    driverObj.drive();
});

window.addEventListener('load', function () {
    const isStartGuide = JSON.parse(localStorage.getItem('startGuideOnLogin'));
    const isBoxChecked = JSON.parse(localStorage.getItem('startGuideBox'));

    console.info('Start Guide: ' + isStartGuide);
    console.info('Input Box: ' + isBoxChecked);

    const checkbox = document.querySelectorAll('.startGuideOnLogin');

    if (checkbox) {
        checkbox.value = isStartGuide;
        checkbox.checked = isBoxChecked;
        
        console.info("values: " + checkbox.value + ", " + checkbox.checked);
    }

    if (isStartGuide === 1) {
        expandHiddenAreas(steps);
        driverObj.drive();
    }
});

Проблема:

1. Значения правильно сохраняются в localStorage, и их можно увидеть, когда я проверяю localStorage в инструментах разработчика браузера.
2. Однако при загрузке страницы флажок не отражает проверенное состояние на основе значений, хранящихся в localStorage.

Предпринятые шаги по устранению неполадок:

1. Проверьте значения localStorage с помощью console.info.
2. Проверил консоль JavaScript на наличие ошибок.
3. Убедитесь, что флажок имеет правильный класс и присутствует в DOM при запуске сценария.

Вопрос:

В чем может быть причина того, что состояние флажка не применяется, несмотря на то, что значения localStorage правильно сохраняются и загружаются? Как я могу решить эту проблему?