ajax请求后javascript不再有效

Question

我正在使用此Image Picker jQuery插件（http://rvera.github.io/image-picker/）来选择PicDiv中的图片进行删除。

选择图像后，我单击DeleteButton删除DeletePic.php选择的图像，并想刷新PicDiv，但在ajax请求后，javascript不再有效。

我从其他重复的问题中找到答案，告诉我绑定的事件处理程序，但它仍然不起作用

<script>
    $(document).ready(function () {
        $(".image-picker").imagepicker({
            limit_reached: function () {
                alert('Limit is 5');
            }  
        });
        });
    $(document).on('click',"#DeleteButton",function(){
            /*get image path*/
            var req = $("div[class='thumbnail selected']").children('img');
            var imagessource = [];
            var srcc = [];
            $(req).each(function (datakey, datavalue) {
                src = $(datavalue).attr('src');
                imagessource.push(src);
            });

            /*delete and refresh*/
            var pp = $.post("DeletePic.php", { 
            'del[]': imagessource
            }, 
            function(){
                alert("OK");     
            }
            )
            .done(function(){
                $('#PicDiv').load(location.href + " #PicDiv");
            })
});    
</script>

HTML

<div id="PicDiv">
<?php

$arr = array();
$us = $_SESSION['Username'];
$i = 0;
mysql_connect("localhost", "AAAA", "AAAA");
mysql_select_db("test");

$strSQL = "SELECT path FROM tb_pic WHERE Username = '" . $us . "' ";
$objQuery = mysql_query($strSQL);
?>
<select class="image-picker" multiple="multiple" data-limit="5">
    <?php
    while ($objResult = mysql_fetch_array($objQuery)) {
        ?>
        <option data-img-src="<?php echo $objResult['path']; ?>" value="<?php echo $i; ?>">AAAAAAAA</option>

<?php
$i++;
}
?>
</select>
</div>

<input id="DeleteButton" name="Submit" type="button" value="Delete">