Как исправить баг в таск менеджере?

Question

H1TMARKER @H1TMARKER

JavaScript

Как исправить баг в таск менеджере?

У меня есть код:

function instruments(){
    triTochki = document.getElementsByClassName('tri-tochki')
      for (i = 0;i<triTochki.length;i++) {
        let a = triTochki[i];
        a.addEventListener('click', function(e) {
            e.target.nextElementSibling.classList.toggle('displayBlock');
          });
      }
    }
    
function showTasks(arr){
    let a = document.getElementById('css')
    if(a != null) a.remove();
    let s = document.createElement('div')
    s.id = 'css';

    for(i=0; i<arr.length; i++){
        let taske = document.createElement('div')
        taske.classList.add('task')

        let tit = document.createElement('div');
        tit.classList.add('title');
        tit.innerText = arr[i].title;
        taske.appendChild(tit);

        let descr = document.createElement('div');
        descr.classList.add('descr');
        descr.innerText = arr[i].desc
        taske.appendChild(descr);

        let bott = document.createElement('div');
        bott.classList.add('bott')
        taske.appendChild(bott);

        let prior = document.createElement('div');
        prior.classList.add('prior');
        prior.innerText = arr[i].prio;
        bott.appendChild(prior);

        let menu = document.createElement('div');
        menu.classList.add('menu');
        bott.appendChild(menu);

        triTochki = document.createElement('div')
        triTochki.classList.add('tri-tochki');
        triTochki.innerText = '...'
        triTochki.dataset.index = arr[i].index;
        bott.appendChild(triTochki);
        

        let menuVipad = document.createElement('div');
        menuVipad.classList.add('menu-vipad');
        menu.appendChild(menuVipad)

        let arrowUp = document.createElement('div')
        arrowUp.classList.add('arrow-up');
        menuVipad.appendChild(arrowUp);

        done = document.createElement('div');
        done.classList.add('done');
        done.dataset.index = arr[i].index;
        menuVipad.appendChild(done);
        done.innerText = 'done'

        edit = document.createElement('div')
        edit.dataset.index = arr[i].index;
        edit.classList.add('edit');
        menuVipad.appendChild(edit);
        edit.innerText = 'edit'

        del = document.createElement('div')
        del.dataset.index = arr[i].index;
        del.classList.add('del');
        menuVipad.appendChild(del);

    s.appendChild(taske);
    }
    tasks.appendChild(s);
    instruments()
}

.menu-vipad{
    width: 50px;
    height: 58px;
    border: 2px solid black;
    text-align: center;
    background-color: #fff;
    position: relative;
    display: none;
    margin-top: 8px;
}
.displayBlock{display: block}

<div class="bott">
            <div class="prior">easy</div>
            <div class="menu">
                <div class="tri-tochki">...</div>
                <div class="menu-vipad">
                    <div class="arrow-up"></div>
                    <div class="done">done</div>
                    <div class="edit">edit</div>
                    <div class="del">delete</div>
                </div>
            </div>
            </div>

Когда нажимаеш на tri-tochki должно появлятся меню menu-vipad. Все работает, но код не находит елемент. Помогите, я ето уже 5 часов делаю.