JSFiddle - React, Tailwind, and code Playground

by Amitabha Ghosh

HTML

<div id="cblist">
    <input type="checkbox" value="first checkbox" id="cb1" /> <label for="cb1">first checkbox</label>
</div>

<input type="text" id="txtName" />
<input type="button" value="ok" id="btnSave" />

JavaScript

function addCheckbox(name) {
   var container = $('#cblist');
   var inputs = container.find('input');
   var id = inputs.length+1;

      $('<input />', { type: 'checkbox', id: 'cb'+id, value: name, checked:'checked' }).appendTo(container);
   $('<label />', { 'for': 'cb'+id, text: name }).appendTo(container);
     
     
}

$('#btnSave').click(function() {
    addCheckbox($('#txtName').val());
    });