JSFiddle - React, Tailwind, and code Playground

HTML

<form accept-charset="UTF-8" action="/" method="get"><div style="margin:0;padding:0;display:inline"><input name="utf8" type="hidden" value="&#x2713;" /></div>
    
    <div class="menuitem category">
        <label for="search_company1">company1</label>
        <input name="search[company1_is_true]" type="hidden" value="0" />
        <input id="search_company1_is_true" name="search[company1_is_true]" type="checkbox" value="1" />
        <div id="counter"></div>
    </div>
    <div class="menuitem category">
        <label for="search_company3">company3</label>
        <input name="search[company3_is_true]" type="hidden" value="0" />
        <input id="search_company3_is_true" name="search[company3_is_true]" type="checkbox" value="1" />
        <div id="counter"></div>
    </div>
    <div class="hidediv">
        <div class="menuitem">
            <label for="search_company2">company2</label>
            <input name="search[company2_is_true]" type="hidden" value="0" />
            <input id="search_company2_is_true" name="search[company2_is_true]" type="checkbox" value="1" />
            
        </div>
    </div>
    <input id="search_submit" name="commit" style="display:none;" type="submit" value="Submit" />
</form>

JavaScript

function countChecked() {
    var checked = $(':checkbox:checked', '.menuitem, .hidediv').length;
     $(this).appendTo($('.container'));
     $('.counter-wrapper').appendTo($(this).parent());
    alert("Number checked:" + checked);
    
}

countChecked();

$(":checkbox").click(countChecked);