document.querySelectorAll('.schedule-category').forEach(node => {
  let opened = false
  let icon = node.querySelector('.schedule-category-collapse-icon')
  let content = node.querySelector('.schedule-category-table')
  let header = node.querySelector('.schedule-category-header')
  header.onclick = () => {
    if (!opened) {
      // open the table
      icon.style.transform = "rotate(180deg)"
      content.style.maxHeight = content.scrollHeight + "px"
    } else {
      // close the table
      icon.style.transform = "rotate(0deg)"
      content.style.maxHeight = null
    }
    opened = !opened
  }
})