javascript - ループ内の2つの異なる変数に対するjavascriptaddEventListener->最初のリスナーが機能しない

Question

buttonEndNumbereventlistenerのみが正しくトリガーされます。はbuttonStartNumber何もしていません。

function appendNumberButtons()
    {
        var xpathExpression = 'id("delform")/div/div/div/div/div/div'
        var xpathResult = document.evaluate(xpathExpression, document, null, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null)
    
        var buttonStartNumber
        var buttonEndNumber
        
        for ( var i=0 ; i < xpathResult.snapshotLength; i++ )
        {
            buttonStartNumber = document.createElement("input")
            buttonStartNumber.setAttribute('type', 'button')
            buttonStartNumber.setAttribute('value',"S"+i)
            //buttonStartNumber.addEventListener('click', function(i){ return function(I){alert(i)} }(i), false);
            listnerHelper(buttonStartNumber, i);
            
            
            buttonEndNumber = document.createElement("input")
            buttonEndNumber.setAttribute('type', 'button')
            buttonEndNumber.setAttribute('value',"E"+i)
            //buttonEndNumber.addEventListener('click', function(i){ return function(I){alert(i)} }(i), false);
            listnerHelper(buttonEndNumber, i);
                    
            xpathResult.snapshotItem(i).innerHTML += " -> "
            xpathResult.snapshotItem(i).appendChild(buttonStartNumber)
            xpathResult.snapshotItem(i).innerHTML += " - "
            xpathResult.snapshotItem(i).appendChild(buttonEndNumber)
        }
    }

私が試したこと：

ある場合とない場合の配列としてlistenerHelper(object, i) -> nop buttonStartNumberの追加関数buttonEndNumberlistenerHelper(object, i) -> nop

私の間違いはどこにありますか？