Tiny cc url to wrap inside li element not working

Question

I am trying to wrap response data inside the li element but its not working. However same script if I do without li and just normal document.getElementbyId.... then its working fine. While wrapping it just shows nothing in the browser.

WORKING without LI

for (x in arrjson) {
    longLink = "http://app.******.com/api/refer/"+arrjson[x];
    customParam = x;
    client.shorten(longLink, {"custom_hash": customParam}).then(function (result) {
        console.log(result);
        if(result.urls[0].error.details != "That custom hash is already in use") {
             document.getElementById("demo").innerHTML += result.urls[0].short_url +"<br>";
        } else {
             document.getElementById("demo").innerHTML += result.urls[0].error.details +"<br>";

        }
    });
}

script working but the output not showing. The text variable is defined outside the function.

    text = "<ol>";
    for (x in arrjson) {
        longLink = "http://app.*****.com/api/refer/"+arrjson[x];
        customParam = x;
        client.shorten(longLink, {"custom_hash": customParam}).then(function (result) {
            console.log(result);
            if(result.urls[0].error.details != "That custom hash is already in use") {
                text += "<li>"+result.urls[0].short_url +"</li>";
            } else {
                text += "<li>"+result.urls[0].error.details +"</li>";

            }
        });
    }
    text += "</ol>"
    document.getElementById("demo").innerHTML += text;

The text variable just return <ol></ol>. However the console.log is returning positive result in both condition.