How can I set the kendoMultiSelect to be k-invalid I have tried the removeClass("valid").addClass("k-invalid"); but that is not working.

               <div id="territoryofDistributioneRow" class="form-group row">
                    <div class="col-md-12">
                        @Html.LabelFor(model => model.selectedTerritoryofDistributioneGUID)
                        @Html.ListBoxFor(
                             x => x.selectedTerritoryofDistributioneGUID,
                             new SelectList(Model.ListOfCountriesItemDictionary, "CountryGUID", "Name", 1),

                             new { id = "multiselectTerritory", @class = "form-control" })
                        <label id="lblTerritoryError" class="pl-4 text-danger" style="display:none">Territory of Distribution is required.</label>
                    </div>
                </div>

Submit

    var multiselectterritorySelected = $("#multiselectTerritory").data("kendoMultiSelect").value().length;
    if (multiselectterritorySelected === 0) {
        $("#lblTerritoryError").show();
        $("#territoryofDistributioneRow").removeClass("valid").addClass("k-invalid");
        extraControls = true
    }
    else {
        $("#lblTerritoryError").hide();
        $("#territoryofDistributioneRow").removeClass("k-invalid").addClass("valid");
    }