JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1/jquery-ui.min.js"></script>
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1/themes/base/jquery-ui.css">
<ul id="selectable">
    <li class="ui-widget-content" rel="group1">Item 1</li>
    <li class="ui-widget-content" rel="group1">Item 2</li>
    <li class="ui-widget-content" rel="group1">Item 3</li>
    <li class="ui-widget-content" rel="group2">Item 4</li>
    <li class="ui-widget-content" rel="group2">Item 5</li>
    <li class="ui-widget-content" rel="group3">Item 6</li>
    <li class="ui-widget-content" rel="group3">Item 7</li>
</ul>

CSS

#feedback { font-size: 1.4em; }
    #selectable .ui-selecting { background: #FECA40; }
    #selectable .ui-selected { background: #F39814; color: white; }
    #selectable { list-style-type: none; margin: 0; padding: 0; width: 60%; }
    #selectable li { margin: 3px; padding: 0.4em; font-size: 1.4em; height: 18px; }

JavaScript

$("#selectable").selectable({
            selected: function (event, ui) {
                var gr1Count = 0;
                var gr2Count = 0;
                var gr3Count = 0;
                $(".ui-selected").each(function () {
                    // Group 1
                    if ('group1' == $(this).attr('rel')) {
                        gr1Count++;
                    }
                    if (gr1Count > 1) {
                        $(this).removeClass('ui-selected')
                    }
                    // Group 2
                    if ('group2' == $(this).attr('rel')) {
                        gr2Count++;
                    }
                    if (gr2Count > 1) {
                        $(this).removeClass('ui-selected')
                    }
                    // Group 3
                    if ('group3' == $(this).attr('rel')) {
                        gr3Count++;
                    }
                    if (gr3Count > 1) {
                        $(this).removeClass('ui-selected')
                    }
                });
            }
        });