Javascript 如何使php内容显示在HTMLdiv元素中

我正在尝试使用ajax和mysql创建一个搜索，并将返回的数据放在一个div中。我正在youtube上学习一个教程，到目前为止还不错，但是我正在尝试将虚拟数据传递到div中，但它没有出现

这是我的jquery

$('#submit').on('click', function() {
var search = $('#search').val();

    if ($.trim(search) != '') { //if search is not equal to nothing - using trim allows users to type in blank space and it won't return anything 
        $.post('searching.php', {search: search}, function(data) {
            $('#search').text(data);
    });
    }
 });

这是我的html

  <div class="container">
    <div class="card card-container">

        <p id="profile-name" class="profile-name-card"></p>
        <form class="form-signin" method="POST">
            <input type="text" name="search" id="search" class="form-control" placeholder="Search">


        </form><!-- /form -->
         <button class="btn btn-lg btn-primary btn-block btn-signin" value= "search" type="required" id="submit" name="submit">Search</button>

    </div><!-- /card-container -->


       <div class="row">

<div class="col-md-4">
<div id="search"></div> 


    <div class="caption">
      <p></p>
    </div>

</div>

搜寻

---

当用户单击search时，search.php文件中的内容应该出现在div中。当前search.php文件中只有echo“content”；。它应该在div中有“content”，但它没有出现在web浏览器中，并且没有错误。在inspect元素的网络中，名称为search.php，状态为ok。不知道我哪里出了问题，任何帮助都将不胜感激

文本不能与输入一起使用

使用val（）而不是text（）进行输入

$（“#btn1”）。单击（函数（）{
$（“#test1”）.text（“你好，世界！”）；
});
$（“#btn2”）。单击（函数（）{
$（“#test2”）.html（“你好，世界！”）；
});
$（“#btn3”）。单击（函数（）{
$（“#test3”）.val（“多利鸭”）；
});

这是一个段落
设置文本
这是另一段
设置HTML
输入字段：

设置值
您的HTML中有多个
id=“search”
元素。所以这不会知道你指的是哪一个：

$('#search')

它可能试图设置
的“文本”，而该文本没有“文本”（它有一个“值”）。更正HTML。将
或
更改为具有唯一的
id
。（当然，还要更新jQuery选择器以及其他针对这些元素的内容。）
不要对输入和div使用相同的id（搜索）

更改html中的id

<div class="container">
    <div class="card card-container">
        <p id="profile-name" class="profile-name-card"></p>
        <form class="form-signin" method="POST">
            <input type="text" name="search" id="search" class="form-control" placeholder="Search">
        </form>
         <button class="btn btn-lg btn-primary btn-block btn-signin" value= "search" type="required" id="submit" name="submit">Search</button>
    </div><!-- /card-container -->
    <div class="row">
    <div class="col-md-4">
        <div id="searchText"></div> 
        <div class="caption">
        <p></p>
    </div>
</div>

$（“#搜索”）。文本（数据）
这只是将响应数据发布到
的文本中。。。这行不通。我已将div id更改为return。但是在$.post（'search.php'，{search:search}，function（data）{在花括号内，我应该更改什么来返回呢？不要紧@Venka Tesh回答了我下面的问题，它现在运行良好。感谢您的帮助：）
<div class="container">
    <div class="card card-container">
        <p id="profile-name" class="profile-name-card"></p>
        <form class="form-signin" method="POST">
            <input type="text" name="search" id="search" class="form-control" placeholder="Search">
        </form>
         <button class="btn btn-lg btn-primary btn-block btn-signin" value= "search" type="required" id="submit" name="submit">Search</button>
    </div><!-- /card-container -->
    <div class="row">
    <div class="col-md-4">
        <div id="searchText"></div> 
        <div class="caption">
        <p></p>
    </div>
</div>

$('#submit').on('click', function() {
var search = $('#search').val();

    if ($.trim(search) != '') { //if search is not equal to nothing - using trim allows users to type in blank space and it won't return anything 
        $.post('searching.php', {search: search}, function(data) {
            $('#searchText').text(data);
    });
    }
 });