Dark/Light mode keep between switching through navigation

Question

so I'm having an issue with this code not keeping the color of when the person chooses to switch to lightmode then move to a different page it resets. How would I change it so it could stay the color they chose between pages.

Here is the HTML

                 <div class="switch-wrap">
                    <div id="switch" class="hover-target">
                        <div id="circle"></div>
                    </div>
                    <!--Credits to Ivan Grozdic Navigation/Dark/Light-->
                    <p><span>dark</span> - <span>light</span></p>
                </div> 

Here is the javascript/jquery

    $("#switch").on('click', function () {
        if ($("body").hasClass("light")) {
            $("body").removeClass("light");
            $("#switch").removeClass("switched");
        }
        else {
            $("body").addClass("light");
            $("#switch").addClass("switched");
        }
    });
})(jQuery);

I have tried doing a document.cookies(ifDarkmode.istrue) and keeping it but I haven not gotten it to work since I am new to coding.