JSFiddle - React, Tailwind, and code Playground

HTML

<div id="add_dependent_template" style="display: none;">
    <div class="dependent_content"> <span>
                    <strong>Dependent<span class="divcount"></span>

        </strong>
        </span><span class="delete">Delete</span>

        <div><strong>Relationship to you</strong>

        </div>
        <div>
            <input type="radio" value="0" name="relationship" class="dependent-relation" />
            <label>Partner</label>
            <input type="radio" value="1" name="relationship" class="dependent-relation" />
            <label>Child under21</label>
            <input type="radio" value="2" name="relationship" class="dependent-relation" />
            <label>dependent over21</label>
        </div>
        <div><strong>Date of birth</strong>

        </div>
        <div>
            <input type="text" id="dependent-dob" name="dependent-dob" datepicker/>
            <input type="hidden" id="dependent-id" name="dependent-id" />
        </div>
    </div>
</div>
<a href="#" id="add">Add</a>

<div id="dependents"></div>

JavaScript

$(document).ready(function () {
    var index = 0;
    $(document).on("click", "#add", function () {
        var html = $("#add_dependent_template").html();
        $new = $("#dependents").append("<div id='dependent" + (++index) + "' " + html + "</div>");
    });
});