动态添加的标签如何调用js事件

在<定制快报>中项目中遇到的问题：

1、动态添加的标签无法绑定js事件函数?

采用寄托绑定：

$("body").on("click",".change",function(){    })

相当于页面渲染（包括js）完成后这个会自动去到另一个容器，标签动态添加之后依然会调用此事件。

2、动态添加的标签无法调用函数？？

如$(‘.draggable-element’).arrangeable( );

如果此函数已经封装好事件（如拖拽），没办法用上面问题1的方法，

所以只能用计时器setTimeout，每次动态添加之后执行调用

setTimeout(function(){
    //新添加的标签再次渲染拖拽事件
    $('.draggable-element').arrangeable();
},50);

在此不建议用setInterval定时器，多次后会出现拖拽不流畅

下面是案例：

<script>
    jQuery(function(){
        $('.icon-add').click(function(){
            var emptyElement = '<div class="node draggable-element"><button type="button" class="btn btn-left ">&nbsp;</button><input type="text" class="empty txt" placeholder="编辑内容" "><button type="button" class="btn btn-default" onclick="$(this).parent().remove();">X</button></div>';
            $('.newsmodel .content').append(emptyElement);
            setTimeout(function(){
                //新添加的标签再次渲染拖拽事件
                $('.draggable-element').arrangeable();
            },50);
            setTimeout(function(){
                //新添加的标签再次能自适应文字宽度
                $(".empty").bind('keydown', function(){
                    $(this).width(textWidth($(this).val()));
                });
            },50);

        });


        $('.btn-value').click(function(){
            var buttonValue = $(this).text();
            var buttonElement ='<div class="node draggable-element d-1"><input type="button" class="btn btn-info txt" value="'+buttonValue+'" ><button type="button" class="btn btn-default" onclick="$(this).parent().remove();">X</button></div>';
            $('.newsmodel .content').append(buttonElement);
            setTimeout(function(){
                //新添加的标签再次渲染拖拽事件
                $('.draggable-element').arrangeable();
            },50);
        });

        //拖拽事件调用
        $('.draggable-element').arrangeable();       
    })