Javascript 只克隆一个字段，每次单击追加一次

我有一个输入上传一个新的文件，我也有一个按钮，添加另一个文件，而无需重新加载页面一次上传多个文件。当我第一次单击“添加另一个文件”时，它会按预期添加新字段，因此总共有两个字段，问题发生在再次单击后，我得到4个字段而不是8个字段等。我希望每次单击仅添加一个字段。 代码：

$（“#文件新建”）。单击（函数（）{
$（“.file item”）.clone（false）.appendTo（“#文件容器”）；
});

---

一如既往地感谢您的帮助！：）

仅克隆具有

fileItem

类的第一个元素

 $("#file-new").click(function () {
        $( ".file-item:first" ).clone(false).appendTo( "#files-container" );
    });

---

仅克隆具有

fileItem

类的第一个元素

 $("#file-new").click(function () {
        $( ".file-item:first" ).clone(false).appendTo( "#files-container" );
    });

使用jQuery：

函数初始化文件（）
{
让
$fileNew=$（“#file new”），
$container=$（“#文件容器”），
$item=$（“”，{class:'file item'}）；
$fileNew。单击（（）=>{
$item.clone（）.appendTo（$container）；
});
}
初始化文件（）
#文件容器
{
宽度：200px；
高度：自动；
填充：10px；
边框：1px虚线#000；
}
.文件项
{
宽度：90%；
高度：10px；
边框：1px实心#000；
保证金：5px自动；
}

新文件
使用jQuery：


函数初始化文件（）
{
让
$fileNew=$（“#file new”），
$container=$（“#文件容器”），
$item=$（“”，{class:'file item'}）；
$fileNew。单击（（）=>{
$item.clone（）.appendTo（$container）；
});
}
初始化文件（）
#文件容器
{
宽度：200px；
高度：自动；
填充：10px；
边框：1px虚线#000；
}
.文件项
{
宽度：90%；
高度：10px；
边框：1px实心#000；
保证金：5px自动；
}

新文件
$（“.file item:first”）$（“.file item:first”）谢谢，它正在工作，我将选择此答案作为解决方案！如果用户多次按“添加另一个文件”，现在如何添加一个按钮来删除字段？
$（“.file item:last”）.remove（）非常感谢！谢谢你，它正在工作，我将选择这个答案作为解决方案！如果用户多次按“添加另一个文件”，现在如何添加一个按钮来删除字段？
$（“.file item:last”）.remove（）非常感谢！