Variable loses its value before appending it

Question

I'm currently working on a project where a Javascript file and a Python server are communicating with each other. A user types a series of messages where they're registered in a 'log.txt' file.

My problem is, the messages that the user is submitting are going to the 'log.txt' file which indicates that mostly everything is working, but for some reason the value of the messages aren't being stored in my 'message' variable and it's simply returning " " on my webpage.

Anybody have any ideas? Thanks in advance.

Javascript:

var getFromServer = function () {
    var request = new XMLHttpRequest();
    request.onreadystatechange = function () {
        if (request.readyState == XMLHttpRequest.DONE) {
            if (request.status >= 200 && request.status < 400) {
                console.log("200 OK. Request has gone through.");
                messages = JSON.parse(request.responseText)
                var userMessage = document.getElementById("message");
                var message = userMessage.value;

                var newListItem = document.createElement("li");
                newListItem.innerHTML = "message=" + message + "<br>";

                var list = document.getElementById("list");
                list.appendChild(newListItem);

            } else {
                console.error("Something has gone wrong. Check your code.");
            }
        }
    }

    request.open("GET","http://localhost:8080/logs");
    request.send();
    console.log(list)
};

HTML:

<div class="message-box">
    <input id="message" type="text">
    <button id="msg-button" type="button">Submit message.</button>
    <button id="return-button" type="button">Click to return messages.</button>
</div>

<table class="logtable">
    <ul id="list"></ul>
</table>        

<script src="log.js"></script>