replaceWith()、remove() 和 empty() 不起作用

Question

我第一次使用 jQuery（我也是 Javascript 的新手），我创建了这段代码来处理表单数据输入：

$(document).ready(function() {
    $('form').submit(function(event) {
        var formData = $('form :input');

        $.ajax({
            type        : 'POST',
            url         : 'process.php',
            data        : formData,
            dataType    : 'text',
            encode      : true
        }).done(function(data) {
            if (data == "OK") {
                var div = $("#add");
                console.log(div);
            }
        });
        event.preventDefault();
    });
});

一切正常，我可以在控制台中看到 div 的内容（其 id 为 add）（我正在使用 Chrome 的代码检查器）。 现在我正在尝试用一条消息替换上述 div 的内容，以向用户确认数据已成功发送。 我尝试使用.replaceWith()、remove() 和empty()，但这些都不适用于选定的 div。

这里是html表单代码：

<div id="add">
    <h3>Form</h3>
    <p>Form fields description</p>
    <hr>
    <form class="form-horizontal" method="post" action="<?php echo $_SERVER['PHP_SELF']; ?>">
        <div class="form-group">
            <label class="control-label col-xs-3" for="name">Name:*</label>
            <div class="col-xs-3">
                <input type="text" class="form-control" id="name" name="name" required>
            </div>
            </div>
        <div class="form-group">
            <label class="control-label col-xs-3" for="desc">Surname:*</label>
            <div class="col-xs-5">
                <input type="text" class="form-control" id="surname" name="surname" required>
            </div>
        </div>
        <br>
        <div class="form-group">
            <div class="col-xs-offset-3 col-xs-6">
                <input type="submit" class="btn btn-primary" value="Submit">
                <input type="reset" class="btn btn-default" value="Reset">
            </div>
        </div>
    </form>
</div>

可能是什么问题？可能我做错了什么……

编辑： 我试过这个：

$("#add").replaceWith("<h3>New content</h3>");

还有这个：

var div = $("#add");
div.remove();

Answer 1

试试jquery的html方法

var newContent = "<p>new content<p>"

$("#add").html(newContent);