Why don't all my checkboxes have the same behavior?

I'm adding some interactivity to a form.

A user will select from a range of activities. Some of the activities have a time-clash.

If a user selects one of the activities with a time-clash, then the activity it clashes with will be disabled and unable to be selected.

If the user then DEselects that checkbox, then they are all enabled and are free to choose any checkbox they want.

Right now, I can disable all the correct boxes. But I am unable to disable them again, aside from the first, frameworks. With the others, I am locked with my decision and have to refresh the page. Why is this happening?

Here is my code:

// Register for Activities section of the form.
document.querySelector(".activities").addEventListener("change", function(){
    var main = document.getElementById("all");
    var framework = document.getElementById("framework");
    var libs = document.getElementById("libs");
    var express = document.getElementById("express");
    var node = document.getElementById("node");
    var build = document.getElementById("build");
    var npm = document.getElementById("npm");

    var frameworkLbl = document.getElementById("frameworkLabel");
    var libsLbl = document.getElementById("libsLabel");
    var expressLbl = document.getElementById("expressLabel");
    var nodeLbl = document.getElementById("nodeLabel");


    // If the user selects a workshop, don't allow selection of a workshop at the same date and time -- you should disable the checkbox and visually indicate that the workshop in the competing time slot isn't available.
    if(framework.checked == true) {
        express.disabled = true;
        expressLbl.style.color = "grey";
    } else if(express.checked == true) {
        framework.disabled=  true;
        frameworkLbl.style.color = "grey";
    } else if(libs.checked == true) {
        node.disabled = true;
        nodeLbl.style.color = "grey";
    } else if(node.checked == true) {
        libs.disabled = true;
        libsLbl.style.color = "grey";
    } 

    // When a user unchecks an activity, make sure that competing activities (if there are any) are no longer disabled.
    if(framework.checked == false) {
        express.disabled = false;
        expressLbl.style.color = "black";
    } else if(express.checked == false) {
        framework.disabled = false;
        frameworkLbl.style.color = "black";
    } else if(libs.checked == false) {
        node.disabled = false;
        nodeLbl.style.color = "black";
    } else if(node.checked == false) {
        libs.disabled = false;
        libsLbl.style.color = "black";
    }
});



      <fieldset class="activities">
        <legend>Register for Activities</legend>
        <div id="activityReminder"></div>
        <div id="lineBreak"></div>
        <label><input type="checkbox" name="all" id="all" class="activity"> Main Conference — $200</label>
        <label id="frameworkLabel"><input type="checkbox" name="js-frameworks" id="framework" class="activity"> JavaScript Frameworks Workshop — Tuesday 9am-12pm, $100</label>
        <label id="libsLabel"><input type="checkbox" name="js-libs" id="libs" class="activity"> JavaScript Libraries Workshop — Tuesday 1pm-4pm, $100</label>
        <label id="expressLabel"><input type="checkbox" name="express" id="express" class="activity"> Express Workshop — Tuesday 9am-12pm, $100</label>
        <label id="nodeLabel"><input type="checkbox" name="node" id="node" class="activity"> Node.js Workshop — Tuesday 1pm-4pm, $100</label>          
        <label><input type="checkbox" name="build-tools" id="build" class="activity"> Build tools Workshop — Wednesday 9am-12pm, $100</label>
        <label><input type="checkbox" name="npm" id="npm" class="activity"> npm Workshop — Wednesday 1pm-4pm, $100</label>
      </fieldset>