¡Hola! estoy intentando crear una lista que me permita mantener el checkbox y el scroll aunque se actualize la página y que cuando hago click en un boton me cambie el color, he conseguido que se mantenga el checkbox y que me cambie el color de la caja mis dudas son las siguientes para el codigo que he escrito como podría hacer: 1. que se mantenga el scroll aunque se actualize la página 2.he conseguido mantener el checkbox y el botón como hacerlo para el resto de items <style> .caja{border:black solid 2px; width:100px; margin: 20px; text-align: center;} .caja.verde{border:black solid 2px; background: green; width:100px; margin: 20px; text-align: center;} </style> <body> <div class='caja' id='caja'>PEPINO</div> <input type='checkbox' id='0'> <input type='number' name='cantidad' style='width: 3em'> <button id='btncomprado'>comprado</button><br> <div class='caja' id='caja1'>manzana</div> <input type='checkbox' id='1'> <input type='number' name='cantidad' style='width: 3em'> <button id='btncomprado1'>comprado</button><br> <div class='caja' id='caja2'>pomelo</div> <input type='checkbox' id='2'> <input type='number' name='cantidad' style='width: 3em'> <button id='btncomprado2'>comprado</button><br> <script> var btn= document.getElementById('btncomprado'), caja=document.getElementById('caja'), contador=0; function cambio() { if(contador==0) { caja.classList.add('verde'); contador=1 } else{caja.classList.remove('verde'); contador=0;} } btn.addEventListener('click',cambio,true) </script> <script> checkbox = document.getElementById('0') checkbox.checked = eval(window.localStorage.getItem(checkbox.id)) checkbox.addEventListener('change', function(){ window.localStorage.setItem(checkbox.id, checkbox.checked) }) </script> </body> </html>