JSFiddle - React, Tailwind, and code Playground

HTML

<form action="" method="post" id="subnewtopicform" />

Title:
                <input type="text" name="title">

<br/>

                Description:
                <textarea name="description"></textarea> 

<br/>
                Category:
<ul class="list:category categorychecklist form-no-clear" id="categorychecklist">

<li id="category-19"><label class="selectit"><input type="radio" id="in-category-19" name="category" value="19"> Animation</label></li>

<li id="category-20"><label class="selectit"><input type="radio" id="in-category-20" name="category" value="20"> Anime</label></li>

    </ul>

                <input type="submit" value="Submit Topic" class="button-primary" name="subnewtopic" id="subnewtopic" disabled="disabled" /> 

            </form>

JavaScript

required = function(fields) {
            var valid = true;
            fields.each(function () { // iterate all
                var $this = $(this);
                if (($this.is(':checkbox') && !$this.is(":checked")) || // checkbox
                    (($this.is(':text') || $this.is('textarea')) && !$this.val()) || // text and textarea
                    ($this.is(':radio') && !$('input[name='+ $this.attr("name") +']:checked').length)) { // radio
                    valid = false;
                }
            });
            return valid;
        }

        validateRealTime = function () {
            var fields = $("form :input:not(:hidden)"); // select required
            fields.on('keyup change keypress blur', function () {
                if (required(fields)) {
                    {subnewtopic.disabled = false} // action if all valid
                } else {
                    {subnewtopic.disabled = true} // action if not valid
                }
            });
        }

        validateRealTime();