Hide/Show all DIVs with specific Class even after fetch new elements in same page

Question

i want to hide all Divs with specific class when user checked box and also page have infinity scroll when user scroll to the end will get more posts on same page i use this code to save user choices on localstorage but I can't get it work and add function to hide the all divs with specific class

thanks for help

const toggleSwitchD = document.querySelector('.hidedes input[type="checkbox"]');
const Hdescription = localStorage.getItem('description');

if (Hdescription) {
    document.documentElement.setAttribute('description', Hdescription);
    if (Hdescription === 'hide') {
        toggleSwitchD.checked = true;
    }
}

function hideDescription(e) {
    if (e.target.checked) {
        document.documentElement.setAttribute('description', 'hide');
        localStorage.setItem('description', 'hide');
            }
    else {        document.documentElement.setAttribute('description', 'show');
          localStorage.setItem('description', 'show');
    }    
}

toggleSwitchD.addEventListener('change', hideDescription, false);

<label class="hidedes" for="checkbox">
        <input type="checkbox" id="checkbox" />
        <div class=""></div>
  </label>

Answer 1

Add a trigger on click function, later with the help of Id (#) or class (.) Use the .addClass("hide") append it to all the divs to hide and .removeClass("hide"); to remove the hidden portion if you need to achieve something simple.