I am able to display out all the details including the button. However, the main problem is that the when I click the button, nothing happens. It says that BtnRemoveAdmin() is not defined when I inspect for errors. However, I have function BtnRemoveAdmin()?? I have tried to move the function to htmlstring. Nothing works. I am not sure what went wrong. 

```
(function () {
$(document).ready(function () {
showadmin();
});

function showadmin() {
var url = serverURL() + "/showadmin.php";

var userid = "userid";
var employeename = "employeename";
var role ="role";

var JSONObject = {
    "userid": userid,
    "employeename": employeename,
    "role": role,
 };

$.ajax({
url: url,
type: 'GET',
data: JSONObject,
dataType: 'json',
contentType: "application/json; charset=utf-8",
success: function (arr) {
    _getAdminResult(arr);
},
    error: function () {
            alert("fail");
    }
});

}

function _getAdminResult(arr) {
    for (var i = 0; i < arr.length; i++) {
    htmlstring = '<div class="grid-container">' +
                 '<div>' + arr[i].userid + '</div>' +
                 '<div>' + arr[i].employeename + '</div>' +
                 '<div>' + arr[i].role + '</div>' +
                 '<div>' + '<button onclick="BtnRemoveAdmin()">Remove</button>' + // 'BtnRemoveAdmin' is not defined
                 '</div>' ;
    $("#name").append(htmlstring);
}   

function BtnRemoveAdmin() {
    var data = event.data;
    removeadmin(data.id);
    } 
}

function removeadmin(userid) {
 window.location = "removeadmin.php?userid=" + userid;
}

})();

```