JSFiddle - React, Tailwind, and code Playground

HTML

<input type="checkbox" name="SubCats" class="subcat-checkbox" value="18001700">first</input>
<input type="checkbox" name="SubCats" class="subcat-checkbox" value="18001700">second</input>
<input type="checkbox" name="SubCats" class="subcat-checkbox" value="18001700">third</input>
<input type="checkbox" name="SubCats" class="subcat-checkbox" value="18001700">forth</input>
<br/>
<button onclick="save()">Save states</button>

JavaScript

function save() {
    var elems = document.getElementsByName("SubCats");
    var states = [];
    for (i = 0; i < elems.length; i++) {
        states.push(elems[i].checked);
    }

    localStorage.setItem("checkboxStates", JSON.stringify(states));
}

function restore() {
    if (localStorage.getItem("checkboxStates") !== null) {
        var states = JSON.parse(localStorage.getItem("checkboxStates"));
        var elems = document.getElementsByName("SubCats");
        for (i = 0; i < elems.length; i++) {
            elems[i].checked = states[i];
        }
    }
}


restore();