javascript - イベント リスナーが別のイベント リスナーの起動を防止する

Question

イベントリスナー（クリック）を使用して移動するナビゲーションがあり、ナビゲーションを無効にする「開始」ボタンがあるため、自動化が行われます。私の問題は、ページを読み込んで「開始」ボタンをクリックすると、ナビゲーションイベントハンドラーが想定どおりにイベントを削除することです。しかし、ページをリロードすると、「開始」をクリックする前にナビゲーションをクリックすると、その後「開始」ボタンは機能しなくなります-まったく起動しません（いくつかのアラートでテスト済み）

ナビゲーション コード:

var hrNav = document.getElementById('hrNav');
    var startButton = document.getElementById('startButton');

    //Check to see if the user is on an iPad or iPhone
    var isiPad = (navigator.userAgent.match(/iPad/i) || navigator.userAgent.match(/iPhone/i)) != null;

//EVENT LISTENER FOR NAVIGATION 
//If the user is on an iphone or ipad, use the touchstart event listener rather than click. Use click otherwise, or use onclick for IE users.
    if (isiPad == true) {
        hrNav.addEventListener('touchstart', highlight);
    } else {
        if(hrNav.addEventListener){  
            hrNav.addEventListener('click', highlight); 
            } else {  
                hrNav.attachEvent('on'+'click', highlight);
        }
    }

    //EVENT LISTENER FOR START BUTTON
if (isiPad == true) {
    startButton.addEventListener('touchstart', start);
} else {
    if(startButton.addEventListener){  
        startButton.addEventListener('click', start);
        } else {  
            startButton.attachEvent('on'+'click', start);
    }
}

    //Function for start button
function start(e) {
hrNav.removeEventListener('click', highlight);
}

    //Function for navigation
    function highlight(ev) {
     //Do Stuff
    }