<div class="jy_footer_2_title-wrap">
  <h4 class="jy_footer_2_title" id="foot_tab_1">Title 1</h4>
  <h4 class="jy_footer_2_title active" id="foot_tab_2">Title 2</h4>
</div>
<div class="foot_tabs">
  <div class="foot_tabs_item iv-drips_tab">
    <ul>
      <li clas="menu-item-type-custom"><a href="#">Link</a></li>
      <li clas="menu-item-type-custom"><a href="#">Link</a></li>
      <li clas="menu-item-type-custom"><a href="#">Link</a></li>
      <li clas="menu-item-type-custom"><a href="#">Link</a></li>
      <li clas="menu-item-type-custom"><a href="#">Link</a></li>
      <li clas="menu-item-type-custom"><a href="#">Link</a></li>
      <li clas="menu-item-type-custom"><a href="#">Link</a></li>
    </ul>
  </div>
  <div class="foot_tabs_item state_tab active">
    <ul>
      <li clas="menu-item-type-custom"><a href="#">Link</a></li>
      <li clas="menu-item-type-custom"><a href="#">Link</a></li>
      <li clas="menu-item-type-custom"><a href="#">Link</a></li>
      <li clas="menu-item-type-custom"><a href="#">Link</a></li>
      <li clas="menu-item-type-custom"><a href="#">Link</a></li>
      <li clas="menu-item-type-custom"><a href="#">Link</a></li>
      <li clas="menu-item-type-custom"><a href="#">Link</a></li>
    </ul>
  </div>
</div>

// title tabs
    let footerTitle = document.querySelectorAll(".jy_footer_2_title");
    document.addEventListener('click', function(event){
        footerTitle.forEach(el => {
            el.classList.remove('active');
        });
        event.target.classList.add('active');
        
        if( event.target == document.getElementById('foot_tab_1')) {
            document.querySelector('.state_tab').classList.remove('active')
            document.querySelector('.iv-drips_tab').classList.add('active')
        } else if(event.target == document.getElementById('foot_tab_2')) {
            document.querySelector('.iv-drips_tab').classList.remove('active')
            document.querySelector('.state_tab').classList.add('active')
        }
    })

    // menu-item click
    let menuItem = document.querySelectorAll(".menu-item-type-custom");
    document.addEventListener('click', function(event){
        menuItem.forEach(el => {
            el.classList.remove('active');
            console.log('foreach');
        });
        event.target.classList.add('active');
        console.log('foreach out');
    })