JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://igniteui.com/js/modernizr.min.js"></script>
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.min.js"></script>
<script src="http://cdn-na.infragistics.com/igniteui/latest/js/infragistics.core.js"></script>
<script src="http://cdn-na.infragistics.com/igniteui/latest/js/infragistics.lob.js"></script>
<link href="http://cdn-na.infragistics.com/igniteui/latest/css/themes/infragistics/infragistics.theme.css" rel="stylesheet"></link>
<link href="http://cdn-na.infragistics.com/igniteui/latest/css/structure/infragistics.css" rel="stylesheet"></link>

<h4 class="combo-label">Drop Down on Focus, Single Selection</h4>
    <div id="singleSelectCombo"></div>

    <h4 class="combo-label">Multiple Selection</h4>
    <div id="multiSelectCombo"></div>

    <h4 class="combo-label">Multiple Selection with Checkboxes</h4>
    <div id="checkboxSelectCombo"></div>
    <label id="lblChange" ></label>
>

CSS

.combo-label {margin-bottom:.5em;}

JavaScript

$(function () {
var colors = [
            { Name: "Black" },
            { Name: "Blue" },
            { Name: "Brown" },
            { Name: "Green" },
            { Name: "Orange" },
            { Name: "Purple" },
            { Name: "Red" },
            { Name: "White" },
            { Name: "Yellow" }
        ];

        $(function () {
var count =0;
            $("#singleSelectCombo").igCombo({
                width: "270px",
                dataSource: colors,
                textKey: "Name",
                valueKey: "Name",
                dropDownOnFocus: true,
                selectionChanged: function (evt, ui) {
                if (ui.items.length == 0) {
                    count=0
                }
                else {
                   count=1

                }
            }
            });

            $("#multiSelectCombo").igCombo({
                width: "270px",
                dataSource: colors,
                textKey: "Name",
                valueKey: "Name",
                multiSelection: {
                    enabled: true
                },
                 selectionChanged: function (evt, ui) {
                if (ui.items.length == 0) {
                    count=0
                }
                else {
                   count=1

                }
                }
            });

            $("#checkboxSelectCombo").igCombo({
                width: "270px",
                dataSource: colors,
                textKey: "Name",
                valueKey: "Name",
                multiSelection: {
                    enabled: true,
                    showCheckboxes: true
                },
                 selectionChanged: function (evt, ui) {
                if (ui.items.length == 0) {
                    count=0
                }
                else {
                   count=1

                }
                }
            });
       if(count = 0)
       {
       jQuery('#lblChange').text("dropdown needs to be...