如果事件是在动态创建的元素上触发的，则更新HTML属性

Question

我有一个简单的表单，其中包含1个电子邮件输入字段和1个“提交”按钮。

默认情况下，该按钮为disabled，仅在验证电子邮件后才启用。

我有2个事件侦听器，一个用于输入字段，另一个用于提交按钮，如下所示：

let _preregForm = document.getElementById( 'form' );
let _emailInputField = document.getElementById( 'email-input' );
let _formSubmitButton = document.getElementById( 'submit-button' );

document.addEventListener( 'input', _handleEmailInput );
document.addEventListener( 'submit', _handleFormSubmission );

const _handleEmailInput = function( event ) {
    if ( event.target && 'input-field' === event.target.id ) {
        _emailValue = event.target.value;
        _toggleSubmitButton( validateEmail( event.target.value ) )
    }
}

const _handleFormSubmission = function( event ) {
    event.preventDefault();

    /* Some Ajax Call which refreshes the entire form based on response. */
}

const _toggleSubmitButton = function( enabled = false ) {
    console.log( _formSubmitButton )
    _formSubmitButton.disabled = ! enabled;
}

在AJAX响应中完全刷新表单后，由于我将处理程序附加在支票input上的document上，因此if ( event.target && 'input-field' === event.target.id )事件仍在输入字段上成功触发。 / p>

console.log显示正确的HTML元素，但未在DOM中更新。

[忽略ID名称，我在上面进行了简化。]

如何更改代码以更新DOM上的属性？