Add a "Select All" checkbox to lists of checkboxes that update an array of objects

I have two lists of checkboxes (there will be additional lists later), for example:

<ul>
    <li><input type="checkbox" onchange="handleChange()" name="job" rel="it-manager" value="IT-Manager" id="IT Manager" class="selectedId" checked> IT Manager</li>
    <li><input type="checkbox" onchange="handleChange()" name="job" rel="consultant" value="Consultant" id="Consultant" class="selectedId" checked> Consultant</li>
</ul>
<ul>
    <li><input type="checkbox" onchange="handleChange()" name="reg" rel="client" value="Client" id="Client" checked> Client</li>
    <li><input type="checkbox" onchange="handleChange()" name="reg" rel="prospect" value="Prospect" id="Prospect" checked> Prospect</li>
<ul>

Whenever combinations of checkboxes are selected/deselected, an array of objects is filtered.

QUESTION What would be the best approach to adding a "Select All" box at the top? I want the functionality to be just like this example. I've tried implementing that example and the checkbox functionality works perfectly, but I can't seem to get the filter to update properly.

I've tried if else statements in filteredBy to no avail. I've tried an additional window function to handle just the "Select All" button, but that is screwing things up.

I realize this is a somewhat vague question, but am hoping maybe someone has run into this before. I am appreciative of any suggestions that can point me in the right direction. JSFIDDLE Thanks!

MORE DETAIL FOR CONTEXT Whenever combinations of checkboxes are selected/deslected onchange in the input tags runs the handleChange() function, which filters an array of objects called sorted and puts the result in the var arrayToFilterUpon. It also runs a function called makeFilteredArray on that var.

window.handleChange = function() {
    arrayToFilterUpon = sorted.filter(filterBy);
    makeFilteredArray(arrayToFilterUpon);
}

The makeFilteredArray function just puts that into a new array filteredArray which is used to update a d3 map.

function makeFilteredArray(array) {
    var filteredArray = [];
    filteredArray.push(array);

Currently, the filter returns objects in the array when property values match checked (using "and" logic).

function filterBy(e) {
    return document.getElementById(e.jobRole).checked
    && document.getElementById(e.regType).checked;
}

And every time a checkbox change is made, the var filteredArray is updated.