JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://jqwidgets.com/public/jqwidgets/jqx-all.js"></script>
<link rel="stylesheet" href="https://jqwidgets.com/public/jqwidgets/styles/jqx.base.css">
<script src="https://jqwidgets.com/public/jqwidgets/jqxknockout.js"></script>
<div class="jqx-widget">
    <div data-bind="jqxDropDownButton:{}">
        <ul data-bind="jqxTree:{source:[{ "id": "2",
                    "parentid": "1",
                    "text": "Hot Chocolate",
                    "value": "$2.3"
                }, {
                    "id": "3",
                    "parentid": "1",
                    "text": "Peppermint Hot Chocolate",
                    "value": "$2.3"
                }, {
                    "id": "4",
                    "parentid": "1",
                    "text": "Salted Caramel Hot Chocolate",
                    "value": "$2.3"
                }, {
                    "id": "5",
                    "parentid": "1",
                    "text": "White Hot Chocolate",
                    "value": "$2.3"
                }, {
                    "text": "Chocolate Beverage",
                    "id": "1",
                    "parentid": "-1",
                    "value": "$2.3"
            }, {
                    "id": "6",
                    "text": "Espresso Beverage",
                    "parentid": "-1",
                    "value": "$2.3"
                }, {
                    "id": "7",
                    "parentid": "6",
                    "text": "Caffe Americano",
                    "value": "$2.3"
                    }, {
                    "id": "8",
                    "text": "Caffe Latte",
                    "parentid": "6",
                    "value": "$2.3"
                }, {
                    "id": "9",
                    "text": "Caffe Mocha",
                    "parentid": "6",
                    "value": "$2.3"
                    }, {
                    "id": "10",
                    "text": "Cappuccino",
                ...

JavaScript

ko.bindingHandlers.jqxDropDownButton = {
    init: function (element, valueAccessor, allBindings, viewModel) {
        var $el = $(element),
            options = ko.unwrap(valueAccessor());
        $el.jqxDropDownButton({
            disabled: false,
            autoOpen: true,
            popupZIndex: 20000,
            enableBrowserBoundsDetection: false,
            animationType: 'slide',
            openDelay: 350,
            closeDelay: 400
        });

        ko.utils.domNodeDisposal.addDisposeCallback($el, function () {
            $el.jqxDropDownButton('destroy');
        });
    }
};