动态添加html后，函数不会执行

Question

我有一个永远不会为动态创建的按钮执行的函数。 我已经搜索过，基本上答案是使用jQuery的.on，但它仍然没有用。我认为问题是该方法是在按钮之前添加到DOM中的，但理论上jQuery .on应该可以正常工作。

我不得不说我使用Flask，也许是因为这导致了这个问题，我现在还不知道。

var rows = "";
ajaxGetRequest('/api/user').done(function(data){
    $.each(data, function(){
        rows +='<button class="btn btn-default btn-edit" title="Edit"><i class="fa fa-pencil fa-fx"></i></button>'
    });
    $(rows).appendTo('#users-list tbody');

$('.btn-edit').on('click', function(){
    console.log('opening modal');

});

希望你们能提前帮助我们。