Why does using two standalone 'if' statements not work, while using two 'if' statements nested within another 'if' does?

I went ahead and tried to solve the challenge ahead of the video and came up with this solution. The first 'if' statement works, and clicking the remove button does remove the li. However, when I click the 'up' button, the li doesn't move up in the list as anticipated. Here is my code:

toggleList.addEventListener('click', (event) => {
    let element = event.target;
    if (element.tagName == 'BUTTON' && element.className == 'remove') {
        let li = element.parentNode;
        let ul = li.parentNode;
        ul.removeChild(li);
    }
    if (element.tagname == 'BUTTON' && element.className == 'up') {
        let li = element.parentNode;
        let previousLi = li.previousElementSibling;
        let ul = li.parentNode;
        ul.insertBefore(li, previousLi);
    }
});

I've already got the code working doing it the same way Guil did in the video, where there are two 'if' statements that test the class names separately within a wrapping conditional that tests whether the tag name is equal to BUTTON, but I want to know why my previous approach doesn't work. (And why it does work for the remove button)

Any ideas?