JSFiddle - React, Tailwind, and code Playground

HTML

<input id="applyButton" type="submit" value="Apply Template" />
    <div id="container">
        <ul></ul>
    </div>
    <div id="content-template" style="display:none;">
        <div>
            <ul>
                <li id="item-template"><span></span></li>
            </ul>
        </div>
    </div>

JavaScript

jQuery(document).ready(function() {
    var currentItemNumber = 1;
    var $list = $('#container ul');
    var $templateContainer = $('#content-template');

    $('#applyButton').click(function() {
        $list.children().remove();

        var i;
        for (i = 0; i < 10; i++) {
            var $newItemInstance = getTemplateInstance('item-template');
            var $itemAnchor = $('span', $newItemInstance);
            $itemAnchor.text('item ' + currentItemNumber++);
            $list.append($newItemInstance);
        }
    });

    function getTemplateInstance(itemID) {
        var $template = $('#' + itemID, $templateContainer);
        var $result = $template.clone();
        $result.removeAttr(itemID);
        return $result;
    }

});