Держите div активным даже после обновления

Question

У меня есть два div, у которых есть логин и регистрация. Я хочу сохранить div, когда пользователь активен даже после обновления

 <div id="main">
     <div class="auth-buttons" >
                    <a href="#login-page" class="btn" id="btn-login" data-toggle="tab">Login</a>
                    <a href="#register-page" class="btn" id="btn-register" data-toggle="tab">Register</a>

                    </div>
 <div id="tabs">
<div id="lgn" class="btns" data-tab-index="0">
<form></form>
</div>
<div id="reg" class="btns" data-tab-index="1">
<form></form>
</div>
    </div>

Я пробовал этот скрипт, но когда я обновляю страницу, которая в данный момент активнавозвращается к логину

<script>
    $("#tabs").tabs({
    active: localStorage.getItem("currentTabIndex"),
    activate: function(event, ui) {
        localStorage.setItem("currentTabIndex",ui.newPanel[0].dataset["tabIndex"]);
    }
});
</script>