Trying to disable a DOM created button given certain conditions

I am trying to traverse a 4x4 grid where the first row is off limits. Essentially this leaves us with a 3x4 grid. I have 4 buttons that control direction (UP/DOWN/LEFT/RIGHT).

If I am at location 4x2 (remember the first row should not be accessed as it is a header), and I press Right, nothing should happen as this would be the 5th spot. If I am at 1x2, I shouldn't be able to push the left button either. Finally, If I am anywhere on the bottom row (1x4,2x4,3x4, or 4x4), I should not be able to push the down arrow.

Unfortunately, I do not understand something as it goes right/left/down/up anyways. This is what I tried:

down.addEventListener("click",function()
{   
    if(document.getElementsByTagName("td")[cellCounter] != 3)
    {
        if(document.getElementsByTagName("td")[cellCounter] != 7)
        {
            if(document.getElementsByTagName("td")[cellCounter] != 11)
            {
                cellCounter += 4;
                document.getElementsByTagName("td")[cellCounter].style.border = "5px solid black";
                document.getElementsByTagName("td")[cellCounter-4].style.border = "1px solid black";
            }
        }
    }
});

So I decided maybe making a function that would disable my up/left/right/down might be easier. I decided that if cellNum == [0-3] that up could be disabled, if cellNum == [0,4,8] that left could be disabled, cellNum == [8-11] down and if cellNum == [3,7,11] that right could be disabled.

How do I implement this though? How do I disable a button that doesn't have an id and how do I identify it? You can look at my, mostly, working code here