Checkboxes to toggle KML on/off not working

I have these 3 KML layers defined:

var currentKmlObjects = [];

currentKmlObjects[0] = new google.maps.KmlLayer('KMLs/TrailsOn4x4.kml',
{preserveViewport : true});

currentKmlObjects[1] = new google.maps.KmlLayer('KMLs/TrailsOnBike.kml',
{preserveViewport : true});

currentKmlObjects[2] = new google.maps.KmlLayer('KMLs/TrailsOnFoot.kml',
{preserveViewport : true});

for (var i = 0; i < currentKmlObjects.length; i++) {      
currentKmlObjects[i].setMap(null);
}

I have a function to toggle the layers On & Off:

function OnOffKML(i) {

    if(currentKmlObjects[i].getMap() === null) {
        currentKmlObjects[i].setMap(map);
    }
    else {
        currentKmlObjects[i].setMap(null);
    }
}

and finally my checkboxes:

<input type="checkbox" id="TrailsOn4x4" onclick="OnOffKML(0)" unchecked/>    <label for="TrailsOn4x4"><hr style=float:left noshade size=2 width=33     color=#F75D59>4x4</label><br/>
<input type="checkbox" id="TrailsOnBike" onclick="OnOffKML(1)" unchecked><label for="TrailsOnBike"><hr style=float:left noshade size=2 width=33 color=blue>&Pi;&omicron;&delta;ή&lambda;&alpha;&tau;&omicron;/Bike</label><br/>
<input type="checkbox" id="TrailsOnFoot" onclick="OnOffKML(2)" unchecked/><label for="TrailsOnFoot"><hr style=float:left noshade size=2 width=33 color=#F87217>&Pi;&epsilon;&zeta;&omicron;&pi;&omicron;&rho;&iota;&kappa;έ&sigmaf;/Hiking</label><br/>

My problem is that although the checkboxes used to work at some point, now they do not anymore. Anyone has an idea why?