javascript - Dropdown Button Only Works Once

I'm attempting to put a button in an HTML table that displays a dropdown menu when clicked, and closes when clicked or when the user clicks outside the menu. It only works one time, then the button appears to stop working entirely. No errors on the console to guide me in the right direction. Code:
HTML:

    
    
    

    
    
    
        

            Seated
            Cancelled
            No Show
            
            Notes
            

        
    

Javascript:

/* When the user clicks on the button,
toggle between hiding and showing the dropdown content */
function toggleDrop() {

  if (document.getElementById("resDrop").style.display != "block"){
    document.getElementById("resDrop").style.display = "block";
    document.getElementById("maindiv").innerHTML = document.getElementById("CurrentRes").innerHTML;
  }else{
    document.getElementById("resDrop").style.display = "none";
    document.getElementById("maindiv").innerHTML = document.getElementById("CurrentRes").innerHTML;
  }
}

$('html').click(function() {

   $('.dropdown-content').hide();
});

$('.dropcontainer').click(function(event){
  event.stopPropagation();
});

CSS:

.dropdown-content {
    display: none;
    position: absolute;
    background-color: #f9f9f9;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
}