jQuery и локальное хранилище: селектор с несколькими состояниями

В настоящее время я работаю над раскрывающимся списком для изменения шрифтов на сайте. В настоящее время в раскрывающемся списке есть несколько разных шрифтов. Код, который вызывается при нажатии одной из раскрывающихся разделов, выглядит следующим образом:

jQuery(function($) {
if ( localStorage.getItem('font-01') ) {
    $('#font-css-01').prop('disabled', localStorage.getItem('font-01') == 'true');
}

$('#font-selector-01').on('click', function() {
    $('#font-css-01').prop('disabled', function(_, prop) {
        localStorage.setItem('font-01', !prop);
        return !prop;
    });
});
});

Теперь этот скрипт повторяется для каждого параметра шрифта (очевидно, только с окончательными номерами). Тем не менее, мне нужен сценарий, чтобы отключить любые предыдущие варианты шрифтов, когда вы разрешаете новый выбор шрифта; в настоящее время неожиданное поведение может возникнуть, когда пользователь выбирает шрифт, отличный от стандартного, и затем выбирает другой шрифт, отличный от стандартного (например, выбирает font-01, затем выбирает font-02). В сущности, я не уверен, как начать расширять этот скрипт, чтобы он сбрасывал предыдущие варианты перед применением новых вариантов.

Функция .prop() предназначена для идентификаторов стилей для разных шрифтов, а выпадающие подэлементы помечены последовательно #font-selector-01 через $font-selector-n.