JSFiddle - React, Tailwind, and code Playground

HTML

<html>
    <head>
    <link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.9/themes/base/jquery-ui.css" type="text/css" />
    </head>
    <body>
        <div id="verbage">
           Please note that though the checkbox is checked in the code, it does not stay checked once the .button call is made. 
        </div>
        <div id="target">
        </div>
    </body>
</html>

JavaScript

$("#target").append(
    $("<div>")
    .attr("id", "btnsType")
    .addClass("jButton")
    .append($("<span>")
            .attr("id", "spanIcon")
            .append($("<input>")
                    .attr("id", "HIDE_MESSAGES_ID")
                    .attr("type", "checkbox")
                    .attr("checked", true))) //Checking the checkbox here
    .append($("<span>")
            .attr("id", "spanLabel")
            .append("Label"))
    .button()
);