```
<button onClick="submit()">Display</button>
<div id="demo"></div>

<script type="text/javascript">
    function submit() {
        var xhr = new XMLHttpRequest();
        xhr.onreadystatechange = function () {
            //add the title of the table.
            if (xhr.readyState === 4) {
                alert(xhr.response);
                var obj = JSON.parse(xhr.response);
                var texts = '<table width="1132" height="232" border="1" align="center"> \
                          <tr> \
                            <th width="19" height="57" align="center" valign="middle">id</th> \
                            <th width="75" align="center" valign="middle">username</th> \
                            <th width="46" align="center" valign="middle">name</th> \
                            <th width="46" align="center" valign="middle">email</th> \
                            <th width="65" align="center" valign="middle">address</th> \
                            <th width="60" align="center" valign="middle">birthdate</th> \
                            <th width="53" align="center" valign="middle">gender</th> \
                            <th width="46" align="center" valign="middle">phone</th> \
                            <th width="39" align="center" valign="middle">point</th> \
                            <th width="37" align="center" valign="middle">coin</th> \
                            <th width="112" align="center" valign="middle">freshchat_deviceToken</th> \
                            <th width="145" align="center" valign="middle">freshchat_restoreId</th> \
                            <th width="96" align="center" valign="middle">fcm_registration_id</th> \
                            <th width="48" align="center" valign="middle">enable</th> \
                            <th width="36" align="center" valign="middle">app</th> \
                            <th width="66" align="center" valign="middle">provider</th> \
                          </tr>';
                if(obj.length > 0){
                    for(var idx = 0; idx < obj.length; idx++){
                        var id = obj[idx].id;
                        var username = obj[idx].username;
                        var name = obj[idx].name;
                        var email = obj[idx].email;
                        var address = obj[idx].address;
                        var birthDate = obj[idx].birthDate;
                        var gender = obj[idx].gender;
                        var phone = obj[idx].phone;
                        var point = obj[idx].point;
                        var coin = obj[idx].coin;
                        var fresh_dev = obj[idx].freshchat_deviceToken;
                        var fresh_res = obj[idx].freshchat_restoreId;
                        var fcm = obj[idx].fcm_registration_id;
                        var enable = obj[idx].enabled;
                        var app = obj[idx].app;
                        var provider = obj[idx].local;
                        texts += '<tr> \
                            <td>' + (id)?id:"Not ready" + '</td> \
                            <td>' + (username)?username:"Not ready" + '</td> \
                            <td>' + (name)?name:"Not ready" + '</td> \
                            <td>' + (email)?email:"Not ready" + '</td> \
                            <td>' + (address)?address:"Not ready" + '</td> \
                            <td>' + (birthDate)?birthDate:"Not ready" + '</td> \
                            <td>' + (gender)?gender:"Not ready" + '</td> \
                            <td>' + (phone)?phone:"Not ready" + '</td> \
                            <td>' + (point)?point:"Not ready" + '</td> \
                            <td>' + (coin)?coin:"Not ready" + '</td> \
                            <td>' + (fresh_dev)?fresh_dev:"Not ready" + '</td> \
                            <td>' + (fresh_rev)?fresh_rev:"Not ready" + '</td> \
                            <td>' + (fcm)?fcm:"Not ready" + '</td> \
                            <td>' + (enable)?enable:"Not ready" + '</td> \
                            <td>' + (app)?app:"Not ready" + '</td> \
                            <td>' + (provider)?provider:"Not ready" + '</td> \
                          </tr>';
                    }
                }
            texts = texts + '</table>';
            document.getElementById("demo").innerHTML = 'sss'+texts;
        }
    }
        xhr.open("GET", "URL", true);
        xhr.setRequestHeader('Authorization', 'Token');
        xhr.send();
    }
</script>

```

[![enter image description here](https://i.stack.imgur.com/TRQCu.png)](https://i.stack.imgur.com/TRQCu.png)

What do I wrong I try to solve this code for 4 hours.
help me please.
there is no any error on console.
I think that the 'text' string is too long. but I don't know how to solve it.
I used get request to call these value. 

```
{id   username   name   email   address birthdate   gender  phone   point   coin    freshchat_deviceToken   freshchat_restoreId fcm_registration_id enable  app provider}

```

and parse it to JSON

I change "()" position to solve it but this times it's nothing shows.
[Updated](https://i.stack.imgur.com/TGrZ6.png)