CSS :checked not functioning

Question

I'm not sure what I did. The :checked pseudo class was working fine to add display:block to the div's where certain inputs were selected. Now if you selected newMowerSelect or usedMowerSelect the newMowerOptions or usedMowerOptions div does not show.

Does anyone see what is wrong?

$('#newAllOptions').click(function() {
  $('input[name=newMowerOption').toggle().prop('checked', true);
});
$('#usedAllOptions').click(function() {
  $('input[name=usedMowerOption').toggle().prop('checked', true);
});

#notifEmail,
#notifPhone,
.equipmentOptionCont {
  display: none;
  transition: all .4s ease;
}

#checkText:checked~#notifPhone,
#checkEmail:checked~#notifEmail,
#newMowerSelect:checked~#newMowerOptions,
#usedMowerSelect:checked~#usedMowerOptions {
  display: block;
  /*transition: all .4s ease;*/
}

#interestContainerMain {
  margin-bottom: 20px;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form>
  <input type="text" name="notifName" placeholder="Name">
  <p>What type of notifications would you like to receive?</p>
  <label>Text Notifications</label>
  <input type="checkbox" name="checkText" class="notifCheck" id="checkText" value="text">
  <label>Email Notifications</label>
  <input type="checkbox" class="notifCheck" name="checkEmail" id="checkEmail" value="email">
  <input type="email" name="notifEmail" id="notifEmail" placeholder="Email*">
  <input type="tel" name="notifPhone" id="notifPhone" placeholder="Phone*">
  <p>Select the types of equipment you would like to receive notifications for</p>
  <div id="interestContainer">
    <div id="interestContainerMain">
      <label>New Mowers</label>
      <input type="checkbox" id="newMowerSelect" class="equipmentMainSel">
      <label>Used Mowers</label>
      <input type="checkbox" id="usedMowerSelect" class="equipmentMainSel">
    </div>
    <div id="newMowerOptions" class="equipmentOptionCont">
      <label>Ferris</label>
      <input type="checkbox" name="newMowerOption" value="Ferris">
      <label>Wright</label>
      <input type="checkbox" name="newMowerOption" value="Wright">
      <label>Big Dog</label>
      <input type="checkbox" name="newMowerOption" value="Big Dog">
      <label>Scag</label>
      <input type="checkbox" name="newMowerOption" value="Scag">
      <div id="newAllOptions">Get notifications for all new mowers</div>
    </div>
    <div id="usedMowerOptions" class="equipmentOptionCont">
      <label>Toro</label>
      <input type="checkbox" name="usedMowerOption" value="Toro">
      <label>John Deere</label>
      <input type="checkbox" name="usedMowerOption" value="John Deere">
      <label>Ferris</label>
      <input type="checkbox" name="usedMowerOption" value="Ferris">
      <label>Bob-Cat</label>
      <input type="checkbox" name="usedMowerOption" value="Bob-Cat">
      <label>Exmark</label>
      <input type="checkbox" name="usedMowerOption" value="Exmark">
      <label>Cub Cadet</label>
      <input type="checkbox" name="usedMowerOption" value="Cub Cadet">
      <label>Snapper</label>
      <input type="checkbox" name="usedMowerOption" value="Snapper">
      <label>Hustler</label>
      <input type="checkbox" name="usedMowerOption" value="Hustler"><br>
      <div id="usedAllOptions">Get notifications for all used mowers</div>
    </div>
  </div>
  <button>Sign up</button>
</form>