如何使用jquery动态添加包含输入标签的行

<script src="https://cdn.jsdelivr.net/npm/jquery/dist/jquery.min.js"></script>

<table id="myTable">
  <thead>
    <tr>
      <th>姓名</th>
      <th>年龄</th>
      <th>操作</th>
    </tr>
  </thead>
  <tbody>
    <!-- 这里是动态添加的行 -->
  </tbody>
</table>

<button id="addRowBtn">添加行</button>

$(document).ready(function() {
  // 监听按钮点击事件
  $('#addRowBtn').click(function() {
    // 创建新的行
    var newRow = $('<tr>');
    
    // 添加输入标签的单元格
    var nameCell = $('<td>').append($('<input>').attr('type', 'text').attr('name', 'name'));
    var ageCell = $('<td>').append($('<input>').attr('type', 'text').attr('name', 'age'));
    
    // 添加删除按钮的单元格
    var deleteCell = $('<td>').append($('<button>').text('删除').click(function() {
      $(this).closest('tr').remove(); // 删除当前行
    }));
    
    // 将单元格添加到新的行中
    newRow.append(nameCell, ageCell, deleteCell);
    
    // 将新的行添加到表格的tbody中
    $('#myTable tbody').append(newRow);
  });
});