Здравствуйте. Помогите доработать код.
Нажимаем на любую из надписей Пуск, надпись становится красной, а рядом стоящее число увеличивается на один, при повторном нажатии все возвращается на исходное положение. Все действия запоминаются в куках браузера пользователя и отображаются при повторных заходах или обновлениях страницы.
Так все и происходит, но если я нажимаю один раз Пуск, чтобы он стал красным, перезагружаю страницу, потом в коде меняю число у того спана по которому кликал, перезагружаю страницу и кликаю несколько раз по тому же спану по которому кликали в самом начале. То число просто идет на уменьшение.
<div class="myClass">
<span class="pusk">пуск</span>
<span class="num">25</span>
<span class="pusk">пуск</span>
<span class="num">30</span>
<span class="pusk">пуск</span>
<span class="num">50</span>
</div>
<script>
let myClass = document.querySelector('.myClass'), arr = [];
for(let e of myClass.querySelectorAll('.num')) arr.push(e.innerText);
let old = JSON.parse(localStorage.getItem('some'));
if(old) myClass.innerHTML = old.html;
myClass.addEventListener('click',e => {
if(e.target.classList.contains('pusk')){
let it = e.target;
let i = [...myClass.querySelectorAll('.pusk')].indexOf(it);
it.nextElementSibling.innerText == arr[i] ?
(++it.nextElementSibling.innerText, it.style.color = 'red') :
(--it.nextElementSibling.innerText, it.style.color = '');
}
});
window.addEventListener('beforeunload',()=> localStorage.setItem('some',JSON.stringify({html : myClass.innerHTML})) );
</script>