Localstorage of multiple Checkboxes

So I have a modal in which a user can check some checkboxes. If the checkbox is checked a div should appear on the normal page.

I want to localstorage the checkboxes and if I reload the page and a checkbox is checked the div should still be visible. I already made the code of showing/hiding the divs but I still need the localstorage but I can't really find how to do this for multiple checkboxes. How do I achieve the localstorage?

HTML:

<div class="container-fluid">
    <div id="mob1-div" class="row hide-div">Mobilisern1</div>
    <div id="rek1-div" class="row hide-div">rekoefeningen1</div>
    <div id="stab1-div" class="row hide-div">stabiliseren1</div>
    <div id="ver1-div" class="row hide-div">versterken1</div>

<button id="myBtn">Open Modal</button>

<div id="myModal" class="modal">

  <div class="modal-content">
        <div class="buttons">
                <div class="row"><div class="col-xs-6 text-center"><button  class="showMob" target="1">Mobiliseren</button></div>
                <div class="col-xs-6"><button  class="showVer" target="2">Stabiliseren</button></div></div>
                <div class="row"><div class="col-xs-6 text-center"><button  class="showStab" target="3">Rekken</button></div>
                <div class="col-xs-6"><button  class="showRek" target="4">Verserken</button></div>
        </div>

        <div id="mob1" class="targetDiv">Mobiliseren 1<input type="checkbox" class="checkbox" data-ptag="mob1-div"/></div>
        <div id="rek1" class="targetDiv">Rekken 1<input type="checkbox" class="checkbox" data-ptag="rek1-div"/></div>
        <div id="stab1" class="targetDiv">Stabilisern 1<input type="checkbox" class="checkbox" data-ptag="stab1-div"/></div>
        <div id="ver1" class="targetDiv">Versterken 1<input type="checkbox" class="checkbox" data-ptag="ver1-div"/></div>
        <button class="close">Opslaan</button>
  </div>
</div>
</div>

Javascript/Jquery:

window.addEventListener('load', function() {

  var modal = document.getElementById('myModal');

  var btn = document.getElementById("myBtn");

  var span = document.getElementsByClassName("close")[0];

  btn.onclick = function() {
    modal.style.display = "block";
  }
  span.onclick = function() {
    modal.style.display = "none";
}
window.onclick = function(event) {
    if (event.target == modal) {
      modal.style.display = "none";
    }
  }
});
$(function(){
    $('.hide-div').hide();
    $('.checkbox').change(function(){
        if($('.checkbox:checked').length==0){
            $('.hide-div').hide();
        }else{
            $('.hide-div').hide();
            $('.checkbox:checked').each(function(){
            $('#'+$(this).attr('data-ptag')).show();

            });
        }
    });
});
$(function(){
        $('.targetDiv').hide();
        $('.showMob').click(function(){
              $('.targetDiv').hide();
              $('#mob1, #mob2, #mob3, #mob4').show();
        });
        $('.showRek').click(function(){
              $('.targetDiv').hide();
              $('#rek1').show();
        });
        $('.showStab').click(function(){
              $('.targetDiv').hide();
              $('#stab1').show();
        });
        $('.showVer').click(function(){
            $('.targetDiv').hide();
            $('#ver1, #ver2, #ver3, #ver4').show();
        });
});

P.S.: I'm just a beginner with javascript/jquery