javascript - 如何更改Jquery克隆位置？

Question

当点击加号图标时，我创建了一个动态克隆 html。它工作正常，但问题是当我单击加号按钮克隆位置在加号按钮之后，但我想更改加号图标之前的克隆位置。

这里是 HTML 代码

<div class="table-responsive" style="max-height: 200px;">                                                                    
   <table class="" style="width: 100%;">
        <tbody id="attendCourse">                                                                        
             <tr id="attendCourse0">                                                                    
               <td style="width: 85%;">                                                  
                  <input name="course" class="form-control" type="text">                                                                                        
               </td>
               <td>
                 <img id="addAttand" src="<?php echo ASSETS_URL; ?>admin/images/plus1.png">
               </td>                                                                 
             </tr>

        </tbody>
    </table>
</div>

HTML 设计图像

Jquery 代码

$(function() {
var $componentTB = $("#attendCourse"),
    $firstTRCopy = $("#attendCourse0").clone();
    $idVal = 1;

$("#addAttand").click(function() {
    var copy = $firstTRCopy.clone();         
    var newId = 'attendCourse' +$idVal;
    copy.attr('id', newId);
    $idVal += 1;
    copy.children('td').last().replaceWith("<td><div class=''><img onclick=\"remove('" + newId + "')\" src="+JS_SITEURL+"assets/admin/images/negative.png></div></td>");        
    $componentTB.append(copy);
});
});

Answer 1

使用insertbefore jquery的方法。

copy.insertBefore($("#attendCourse0"));