JSFiddle - React, Tailwind, and code Playground

by Jim_Toth

HTML

<div id="clonTest">
    
    <form class="target">
        <h2>Title</h2>
        <input type="text" value="" id="inputID1">
        <input type="button" value="Add" data-insert="inputID1"><br>
        <label><input type="checkbox" id="checkboxID1" value="value">checkBox</label><br>
        <textarea rows="3" cols="30" id="textareaID1"></textarea>
    </form>
            
    <form class="target">
        <h2>Title</h2>
        <input type="text" value="" id="inputID2">
        <input type="button" value="Add" data-insert="inputID2"><br>
        <label><input type="checkbox" id="checkboxID3" value="value">checkBox</label><br>
        <textarea rows="3" cols="30" id="textareaID2"></textarea>
    </form>
            
</div>
<button id="clone" data-target="target">clone</button>

JavaScript

$('body').on('click', '#clone',function(){
    var $$target = '.'+$(this).data('target'),
        $$cloneTarget = $($$target).last().clone();
    $($$target).last().after($$cloneTarget);
});