JSFiddle - React, Tailwind, and code Playground

by techiedelight

HTML

<!doctype html>
<html>
  <body>
    <div id="container"></div>
    <div>
      <button id="submit">Create Radio Button</button>
    </div>
  </body>
</html>

CSS

p,
label {
  font: 15px 'Exo 2', sans-serif;
}

input {
  margin: 6px;
}

button {
  margin-top: 10px;
  padding: 2 2;
  font: 15px 'Exo 2', sans-serif;
}

JavaScript

document.getElementById('submit').onclick = function() {
  var radiobox = document.createElement('input');
  radiobox.type = 'radio';
  radiobox.id = 'contact';
  radiobox.value = 'email';

  var label = document.createElement('label')
  label.htmlFor = 'contact';

  var description = document.createTextNode('Email');
  label.appendChild(description);

  var newline = document.createElement('br');

  var container = document.getElementById('container');
  container.appendChild(radiobox);
  container.appendChild(label);
  container.appendChild(newline);
}