Javascript Jquery克隆/删除-将元素添加到输出

我在div及其元素上具有克隆/删除功能。这部分工作正常，但我有一个生成代码按钮，我需要在生成新克隆的元素时输出这些元素的内容

目前，我有用于在页面上输出原始div元素的当前javascript，但我想知道是否有一种方法可以根据div是否已被克隆或删除而动态追加输出

var cloneIndex=$（“.clonedInput”）.length；
函数克隆（）{
$（this.parents（“.clonedInput”）.clone（）
.附件（“正文”）
.attr（“id”、“克隆输入”+克隆索引）
.on（'click'、'button.clone'，clone）
.on（'click'，'button.remove'，'remove'）；
克隆索引++；
}
函数删除（）{
$（this.parents（“.clonedInput”）.remove（）；
}
$（“button.clone”）。单击（“单击”，克隆）；
$（“button.remove”）。单击（“单击”，删除）；
/*生成代码*/
函数myFunction（）{
变量引号=“”；
var mobile_start=”
function myFunction() {
    var code = "";
    $(".clonedInput").each(function() {
        var title=$(this).find(".title_text").val(),
            productName=$(this).find(".name_text").val();
        code += ....... //append the code for each element
    });
    $("#top").html(code);
}


产品
标题：
产品名称：
克隆
去除
生成代码
为字段使用类名而不是id。生成输出时，循环遍历每个
克隆输入
，并选择其子项中的字段，如：

提示：为函数、变量和元素名称使用适当的描述性名称。
这个问题很难理解。混合使用不引人注目的事件侦听器（如jQuery侦听器）也不是一个好的做法和内联的。选择一种方法并保持一致。非常感谢加布里埃尔。如果有帮助的话，请考虑将其标记为解决方案。谢谢。