JSFiddle - React, Tailwind, and code Playground

HTML

<html>
  <head>
     <link href="http://jqueryui.com/themes/base/jquery.ui.all.css"  rel="stylesheet" type="text/css" />
      <style type='text/css'>
          label span{
          font-size:12px;
          }
      </style>
  </head>
    <body>
        <div id='buttonArea' style='height:100px;width:200px;position:absolute;left:30px;top:30px'></div>
    </body>
</html>

JavaScript

$().ready(function(){
        var _radioControls = $("<div>").attr("id", "radio_") .append($("<input type='radio'>").attr("Name", "ascdesc_").attr("id", "a_").attr("checked", "true").attr("value", "asc")).append($("<label>").attr("for", "a_").text("asc"))
    .append($("<input type='radio'>").attr("Name", "ascdesc_").attr("id", "d_").attr("value", "desc"))                          .append($("<label>").attr("for", "d_").text("desc"));

    _radioControls.buttonset();

$("#buttonArea").append(_radioControls);
    
});