HTML код в local storage
Задача: есть кинозал с возможностью выбирать места, по клику на место у него меняется класс на seat--selected. Нужно сохранять выбранные места в local storage чтобы после перезагрузки страницы места "оставались выбранными".
<section class="hall">
<div class="seats-row">
<div class="seat"></div>
<div class="seat"></div>
<div class="seat"></div>
<div class="seat"></div>
<div class="seat seat--selected"></div>
<div class="seat"></div>
<div class="seat seat--selected"></div>
<div class="seat"></div>
</div>
</section>
Методом тыка пришел к варианту записывать в local storage верстку кинозала при каждом обновлении выбора мест, а после обновления страницы записывать верстку из local storage через innerHTML.
const $hall = document.querySelector('.hall');
function onSeatClick(e) {
//тут код смены класса
localStorage.setItem("hall", JSON.stringify($hall.innerHTML));
}
Собственно вопрос: насколько корректно записывать в local storage HTML? Если не очень, то какие еще есть варианты решения задачи?