Javascript 按下编辑按钮时更新行并保存在jquery中

我不熟悉jquery和javascript。我需要帮助的最后一个功能是，单击编辑按钮后，您可以更新两个文本框并保存它，但我需要它显示放置它的表行所在的更新行，而不是在更新它并将其显示在表底部之后。下面是我的代码的样子。谢谢

函数删除（删除链接）{
$（deletelink）.tr.remove（）；
if（$（“tbody”）.find（“tr”）.length==0）{
$（“tbody”）.append（“不再记录”）；
}
返回false；
}
功能编辑（编辑链接）{
var name=$（editlink）.closest（“tr”）.find（“td.name”）.text（）；
var course=$（editlink.closest（“tr”）.find（“td.course”）.text（）；
$（“#名称”）.val（名称）；
$（“课程”）.val（课程）；
$（“#按钮”）.val（“保存”）；
}
$（文档）.ready（函数（）{
$（“.delete”）。单击（函数（）{
移除（此）；
});
$（“.edit”）。单击（函数（）{
var$this=$（this）；
var tds=$this.closest（'tr'）.find（'td'）.filter（函数（）{
返回$（this）.find（'.edit'）.length==0；
});
如果（$this.html（）=='edit'）{
$this.html（'save'）；
tds.prop（'contenteditable'，true）；
}否则{
$this.html（'edit'）；
tds.prop（'contenteditable'，false）；
}
编辑（本）；
});
$（“#按钮”）。单击（函数（）{
var name=$（“#name”）.val（）；
var course=$（“#course”）.val（）；
如果（$（“tbody”）.find（“tr#nomore”）.length>0）{
$（“tbody”）.html（“”）；
}
$（“tbody”）.append（“+name+”“+course+”）；
$（“.delete”）。单击（函数（）{}）；
$（“.delete”）。单击（函数（）{
移除（此）；
});
$（“.edit”）。单击（函数（）{}）；
$（“.edit”）。单击（函数（）{
编辑（本）；
});
});
});




名称
课程
华金
BSIT
跳跃
BSIT
埃尔桑
BSHRM
拉雷
BSIT
像这样的东西怎么样


请将您的问题简化为手头的问题，因为您现在很难筛选所有代码。为此，您需要使用某种模板框架。JQuery很旧，不适合这种工作。@Miguel我不同意，而模板框架或javascript框架（angular、react vue等）将是一种解决方案。我认为Jquery或普通的老式vanilla js肯定是最合适的task@BryanDellinger我从来没有说过JQuery做不到。我说它不适合做这种工作。使用支持数据绑定的框架可以更容易地完成上下文切换。雇主也不需要JQuery专业人士。他们更喜欢那些更擅长核心JS的人。
$(document).ready(function() {
   let row = null

   $('.edit').click(function() {
     row = $(this).closest('tr');
     $('#a').val(row.find('td:eq(0)').text())
     $('#b').val(row.find('td:eq(1)').text())
   });

   $('#submit').click(function() {
     if (row) {
       row.find('td:eq(0)').text($('#a').val());
       row.find('td:eq(1)').text($('#b').val());
       $('#a').val('');
       $('#b').val('');
     }
   })


 });