JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<link rel="stylesheet" href="js/jquery-ui.css">
<body>
    <input id="condition" type="text" placeholder="condition">

JavaScript

var selectedItems= [];
	
var availableTags = [
               "ActionScript",
               "AppleScript",
               "Asp",
               "BASIC",
               "C",
               "C++",
               "Clojure",
               "COBOL",
               "ColdFusion",
               "Erlang",
               "Fortran",
               "Groovy",
               "Haskell",
               "Java",
               "JavaScript",
               "Lisp",
               "Perl",
               "PHP",
               "Python",
               "Ruby",
               "Scala",
               "Scheme"
    ];

    $(document).ready(function () {
        $('#condition').autocomplete({
            source: availableTags,
            minLength: 0,
            select:function(event, ui) {
                                
                selectedItems.push(ui.item.label);
              }
        }).focus(function () {
            try {
                $(this).autocomplete("search");
            }
            catch (e) {

            }
        })
        .data( "autocomplete" )._renderItem = function( ul, item ) {
               var checked = ($.inArray(item.label, selectedItems) >= 0 ? 'checked' : '');
        return $( "<li></li>" )
            .data( "item.autocomplete", item )
            .append( '<a><input type="checkbox"' + checked + '/>' + item.label + '</a>' )
            .appendTo( ul );
        }
  
    });