Есть вот такая разметка:
<div class="product-list-wrapper">
<div class="rows-wrapper">
<div class="wrapper-buttons">
<button value="product_card_full_width" class="list-view">List</button>
<button value="product_card_frontpage" class="grid-view">Grid</button>
</div>
<div class="views-row"></div>
<div class="views-row"></div>
<div class="views-row"></div>
</div>
</div>
Нужно при клике на кнопку с классом list-view добавлять всем
<div>
с классом views-row класс full а при клике на на кнопку с классом grid-view удалять класс full и чтобы после перезагрузки страницы класс full не исчезал.
Добавления класса можно реализовать вот так(добавив в localStorage):
let cardViewState = localStorage.getItem('cardView');
if(cardViewState) {
$('.views-row').addClass('full');
}
$(document).on('click', '.list-view', function() {
if (cardViewState) {
localStorage.setItem('cardView', 0);
} else {
localStorage.setItem('cardView', 1);
}
$('.views-row').addClass('full');
});
А как при клике на кнопку с классом grid-view удалять класс full из localStorage?