JSFiddle - React, Tailwind, and code Playground

HTML

<div id="buttonset1">
  <input id="radio1" type="radio" name="radio"/>
  <label for="radio1">Radio 1</label>
  <input id="radio2" type="radio" name="radio"/>
  <label for="radio2">Radio 2</label>
</div>

<button onclick="addRadio()">Add radio</button>

<br/><br/>

<div id="buttonset2">
  <input id="check1" type="checkbox" />
  <label for="check1">Checkbox 1</label>
  <input id="check2" type="checkbox" />
  <label for="check2">Checkbox 2</label>
</div>

<button onclick="addCheckbox()">Add checkbox</button>

JavaScript

counter = 0;

$('#buttonset1').buttonset();
$('#buttonset2').buttonset();

addRadio = function() {
  var id = 'new' + (counter++).toString();
  $('<input id="' + id + '" type="radio" name="radio"/>').appendTo('#buttonset1');
  $('<label for="' + id + '">New</label>').appendTo('#buttonset1');
  $('#buttonset1').buttonset('refresh');
};

addCheckbox = function() {
  var id = 'new' + (counter++).toString();
  $('<input id="' + id + '" type="checkbox"/>').appendTo('#buttonset2');
  $('<label for="' + id + '">New</label>').appendTo('#buttonset2');
  $('#buttonset2').buttonset('refresh');
};