Создание переключателя темной темы - jQuery localStorage и CSS

Question

Я новичок в jQuery и localStorage. Я создаю вариант темной темы для выбора пользователями. У меня все работает нормально, но я уверен, что должен быть способ получше. Это код, который у меня сейчас есть, и я знаю, что повторяю слишком много кода. Просто не могу понять, как это упростить. Как уже упоминалось, код работает нормально, но при загрузке страницы все еще мигает светлая тема, прежде чем она попадет в локальное хранилище, как я полагаю. Таким образом, даже несмотря на то, что они выбирают ТЕМНУЮ тему, при загрузке страницы происходит мигание светлой темы в течение 1 секунды перед ее переключением.

ЭТО КОД

    $(document).ready(function() {
    var darkmode_data = localStorage.getItem("darkmode");
    //CHK LOCALSTORAGE
    if (darkmode_data == "yes") {
        $("#darkmode").prop('checked', true);
        $('body, .cardicon, .odd').toggleClass('darkmodebg');
        $('.card-body,.card, footer.page-footer,.even').toggleClass('darkmodebg2');
        $('h1,h2,h3,h4,h5,h6').toggleClass('darkmodetxt');
        $('hr').toggleClass('darkmodehr');
        $('.card .number').toggleClass('darkmodeblue');
    }
    else if(darkmode_data == "no"){
        $("#darkmode").prop('checked', false);
    }
    //CLICK FUNCTION
    $('#darkmode').click(function(e) {
        $('body, .cardicon,.odd').toggleClass('darkmodebg');
        $('.card-body,.card, footer.page-footer,.even').toggleClass('darkmodebg2');
        $('h1,h2,h3,h4,h5,h6').toggleClass('darkmodetxt');
        $('hr').toggleClass('darkmodehr');
        $('.card .number').toggleClass('darkmodeblue');
        if ($(this).is(":checked")) {
            localStorage.setItem("darkmode", "yes");
        } 
        else {
            localStorage.setItem("darkmode", "no");            
        }
    });
 });

Как вы можете видеть в коде, когда пользователь переключается в темный режим, я меняю несколько стилей элементов (14).

Большое спасибо за вашу помощь. Я ценю это.