使用AJAX删除表/数据库项时出现问题

现在我已经为我正在处理的这个任务组织者项目准备了几个AJAX方法——到目前为止，我只处理了部分插入和删除。出于某种原因，我不明白为什么在刷新页面之前无法删除新条目。PHP生成的代码（后面的第五个回显显示了我传递与数据库taskID相关的ID的位置）：

function generateTaskTable(){
    $con = mysql_connect('localhost', '-', '-');
    if (!$con) {
        die('Could not connect: ' . mysql_error());
    }
    mysql_select_db("tasks", $con);
    $result = mysql_query("SELECT * FROM tasks order by taskDate ASC");
    echo '<table id="task_table">';
    while($row = mysql_fetch_array($result))
    {
        $id = $row['taskID'];
        echo '<tr id="row'.$id.'">';
        echo '<td>'.convertDate($row['taskDate']).'</td>';
        echo '<td>'.$row['hours'].'</td>';
        echo '<td>'.$row['task'].'</td>';
        echo '<td><a href=""><img src="images/trash.png" class="delete" name="'.$id.'"></a>
        <a href=""><img src="images/delete.png" class="unsuccessful"></a>
        <a href=""><img src="images/check.png" class="successful"></a></td>';
        echo '</tr>';
    }
    echo '</table>';
    mysql_close($con);
}

JQuery/Ajax调用：

<script type="text/javascript">
    $(document).ready(function(){
        $('.delete').click(function(e){
            var deleteID = $(this).attr('name');
            var row = deleteID;
            $.ajax({
                type: "POST",
                url: "ajax.php",
                data: "deleteID="+ deleteID,
                success: function(result){
                    $('#row'+row).fadeOut('fast');
                }
            });
            e.preventDefault();
        });
        $("form#submit").submit(function(e) {
            var day = $('#dayDD').val();
            var month = $('#monthDD').val();
            var year = $('#yearDD').val();
            var hours = $('#hours_text').val();
            var task = $('#task_text').val();
            $.ajax({
                type: "POST",
                url: "ajax.php",
                data: "day=" + day + "&month=" + month + "&year=" + year + "&hours=" + hours + "&task=" + task,
                success: function(result){
                    $('#hours_text').val('');
                    $('#task_text').val('');
                    $('#task_table').append(result);
                }
            });
            e.preventDefault();
        });
    });
</script>

ajax.php：

if(isset($_POST['deleteID'])){
    deleteTask($_POST['deleteID']); 
}
if (isset($_POST['task'])&& isset($_POST['hours'])){
    $newID = insertTask();
    $month = $_POST['month'];
    $day = $_POST['day'];
    $year = $_POST['year'];
    $task = $_POST['task'];
    $hours = $_POST['hours'];
    $day = str_pad($day, 2, "0", STR_PAD_LEFT);
    echo'<tr id="row'.$newID.'"><td>'.$month.' '.$day.', '.$year.'</td><td>'.$hours.'</td><td>'.$task.'</td><td><a href=""><img src="images/trash.png" class="delete" name="'.$newID.'"></a><a href=""><img src="images/delete.png" class="unsuccessful"></a><a href=""><img src="images/check.png" class="successful"></a></td></tr>';
}

ajax.php的底部显示了返回ajax调用的代码。当我查看生成的源时，一旦添加了一个新条目，新生成的ID是正确的，并且正确地分配给了图像名称——但它不能正常工作。页面不会从表和数据库中删除，而是会刷新，直到您再次单击图像，项目才会被删除。我还注意到图标对齐有点偏离，我不知道为什么，因为生成的源显示的格式与所有其他表项完全相同。

删除功能：

function deleteTask($id){
    $con = mysql_connect('localhost', '-', '-');
    if (!$con) {
        die('Could not connect: ' . mysql_error());
    }
    mysql_select_db("tasks", $con);
    $result = mysql_query("DELETE FROM tasks WHERE taskID=$id");
    mysql_close($con);
}

编辑：好吧，我想我可能从其他一些Stack Overflow帖子中知道这出了什么问题——也许我的JQuery $('.delete').click函数不起作用，因为它只有在document.ready触发时才运行。PHP生成的JQuery返回并在页面上创建另一个表元素，它具有正确的ID标记以便删除，但document.ready已经使类为"delete"的元素可以点击（只是不是新的）。这有可能吗？如果是，我该如何解决？谢谢