Cannot read properties of undefined (reading 'className')

Here is the js function that includes the className property:

function filterSelection(f){
var c, i;
c = document.getElementsByClassName("filterDiv");
if(f=="all") f="";
for(i = 0; i<c.length ;i++){
    classRemove(c[i], "show");
    if(c[i].className.indexOf(f) > -1) classAdd(c[i],"show");
}

}

I copied it straight from w3schools, with a few changes to variable names but that’s it. Does the placement of my script tag have anything to do with this?

Here’s the HTML code it applies to:

<div id = "btnContainer">
    <button class = "btn active" onclick = "filterSelection('all')"> All classes</button>
    <button class = "btn" onclick ="filterSelection('myclasses')"> My classes</button>
</div>
<div class = "container">
    <div class = "filterDiv <?php echo $bookmark1;?>">
    Test Class 1
    <button id = "addBtn-1" onclick = "noneAdd();add()">Add to My Classes</button>
    <button id = "removeBtn-1" class = "none" onclick = "noneRemove();remove()">Remove from My Classes</button>
    </div>
</div>

Ignore all the other elements, they most likely don’t work but I’m confused as to why I’m getting this error specifically since it was a copy of w3schools’ code.

>Solution :

As per the above provided code, the error seems to be in the classRemove() function.

If possible, send the body of classRemove here too so that we may find what the actual error is!.