jQuery bootstrap theme switcher

I made a little function to switch from a dark version of my hub to a light version. However, my code isn't working, and I've checked the console and have no errors logged.

Could anyone help me spot the problem? I'm a noob and new with jQuery/Javascript. When I click on the link, it does nothing and no errors are generated.

This is the code:

<li>
    <a id="switch-theme" href="#" rel="tooltip" title="Change style" onclick="return false;">
          <i class="fa fa-paint-brush"></i>
    </a>
</li>

<script>
currentTheme = localStorage['theme'];
if(currentTheme == null) //theme isn't set, just set it to dark.
    currentTheme = "dark";

function themeHandler() {
    $("head link#theme-stylesheet").attr("href", "includes/frontend/theme/bootstrap-" + currentTheme + ".min.css");

    //handle theme switching.
    $("#switch-theme").click(function() {
        var theme = "dark";
        if(currentTheme == "dark") {
            theme = "light";
        }
        localStorage['theme'] = theme;
        currentTheme = theme;
        $("head link#theme-stylesheet").attr("href", "includes/frontend/theme/bootstrap-" + theme + ".min.css");
    });

    //we just want the current theme.
    return false;
}

$(document).ready(function() {
    $("[rel=tooltip]").tooltip();
    themeHandler();
});

</script>

What do I need to do to make this work as I expect?