在未知数量的按钮上添加EventListener

Question

我有一个for循环的问题，该循环会附加一些数据并建立一个表。

for (var p = 0; p < Tbarray.length; p++) 
{
    if (notfirsttime == 'false') 
    {
        $("#Ttable").append('<tr><th>Course</th><th>Places left</th><th>Time</th><th>Date</th></tr>');
        $("#Ttable").append('<tr><td>' + Tbarray[p][0] + '</td><td>' + Tbarray[p][3] + '</td><td>' + Tbarray[p][2] + '</td><td>' + Tbarray[p][1] + '</td><td><button  role="button" id="Signupbutton'+p+'">Sign Up</button></td></tr>');
    }

    notfirsttime = 'true';

    } else 
    {
       $("#Ttable").append('<tr><td>' + Tbarray[p][0] + '</td><td>' + Tbarray[p][3] + '</td><td>' + Tbarray[p][2] + '</td><td>' + Tbarray[p][1] + '</td><td><button  role="button" id="Signupbutton'+p+'">Sign Up</button></td></tr>');
    }

}

现在此代码还在该行的末尾添加了一个按钮，我只能输入一百左右

var buttonSignup = document.getElementById("Signupbutton0");

if (buttonSignup) {
    buttonSignup.addEventListener('click', test);
}

然后至少前100个按钮可以使用，但是我不知道会有多少行。这将上升和下降。我正在寻找一种更好的方法来做到这一点。如果有人有什么想法真的很有帮助。