Cuando hay un cambio en la estanteria osea que cambie de vacia a llena deberia guardar el cambio pero No guarda los cambios efectuados. al recragar la pagina vuelve a su estado inicial
var jQ = jQuery;
var estanteria = {};
jQ(document).ready(function(){
jQ('.celda').each(function(){
if(jQ(this).hasClass('llena'))estanteria[jQ(this).attr('id')] = 'llena';
else estanteria[jQ(this).attr('id')] = 'vacia';
});
localStorage.setItem('estanteria', JSON.stringify(estanteria));
jQ('body').on('click', '.celda', function(){
var id = jQ(this).attr('id');
estanteria = JSON.parse(localStorage.getItem('estanteria'));
if(jQ(this).hasClass('llena')){
estanteria[id] = 'vacia';
jQ(this).removeClass('llena');
}else{
jQ(this).addClass('llena');
estanteria[id] = 'llena';
}
console.log(estanteria);
console.log(localStorage.getItem('estanteria'));
localStorage.setItem('estanteria', JSON.stringify(estanteria))
});
jQ('body').on('click', '#verLocalStorage', function(){
jQ('#contLocalStorage').html(localStorage.getItem('estanteria'));
});
});
HTML
<div id="a" class="celda llena">1</div>
<div id="b" class="celda">2</div>