Show/Hide Ribbonbutton Based on current userroles

Step:1
Create ribbon button

Step:2
Add Enable Rule

Step:3
Add Custom Rule

Call Below "showhideribbonbutton" function
NOTE: mention role names for whom button has to be shown


function showhideribbonbutton(rowdata, userLCID) {
var result=false;
        var currentUserId = Xrm.Page.context.getUserId();
        currentUserId = currentUserId.replace('{', '').replace('}', '');
        var currentUserRoles = getCurrentUserRoles(currentUserId);
        for (var i = 0; i < currentUserRoles.length; i++) {
            if (currentUserRoles[i] == "System Administrator" ||currentUserRoles[i] == "CSR MANAGER") {
               result=true;
            }
        }
 
    return result;
}


function getCurrentUserRoles(currentUserId) {
    var userRoleName = new Array();
    var req = new XMLHttpRequest();
    req.open("GET", Xrm.Page.context.getClientUrl() + "/api/data/v8.1/systemuserrolescollection?$select=roleid&$filter=systemuserid eq " + currentUserId, false);
    req.setRequestHeader("OData-MaxVersion", "4.0");
    req.setRequestHeader("OData-Version", "4.0");
    req.setRequestHeader("Accept", "application/json");
    req.setRequestHeader("Content-Type", "application/json; charset=utf-8");
    req.setRequestHeader("Prefer", "odata.include-annotations=\"*\"");
    req.onreadystatechange = function () {
        if (this.readyState === 4) {
            req.onreadystatechange = null;
            if (this.status === 200) {
                var results = JSON.parse(this.response);
                for (var i = 0; i < results.value.length; i++) {
                    var userRoleId = results.value[i]["roleid"];

                    userRoleName[i] = GetRoleName(userRoleId);
                }
            } else {
                Xrm.Utility.alertDialog(this.statusText);
                return userRoleName;
            }
        }
    };
    req.send();
    return userRoleName;
}

function GetRoleName(userRoleId) {
    var userRoleName;
    var req = new XMLHttpRequest();
    req.open("GET", Xrm.Page.context.getClientUrl() + "/api/data/v8.0/roles(" + userRoleId + ")?$select=name,roleid", false);
    req.setRequestHeader("OData-MaxVersion", "4.0");
    req.setRequestHeader("OData-Version", "4.0");
    req.setRequestHeader("Accept", "application/json");
    req.setRequestHeader("Content-Type", "application/json; charset=utf-8");
    req.setRequestHeader("Prefer", "odata.include-annotations=\"*\"");
    req.onreadystatechange = function () {
        if (this.readyState === 4) {
            req.onreadystatechange = null;
            if (this.status === 200) {
                var result = JSON.parse(this.response);
                userRoleName = result["name"];
                //var roleid = result["roleid"];
                return userRoleName;
            } else {
                Xrm.Utility.alertDialog(this.statusText);
                return userRoleName;
            }
        }
    };
    req.send();
    return userRoleName;
}