Variable not updating in firefox content script when using self.port.on

Question

I'm trying to update the version var and that's not working the way my mind thinks it should. For instance, when I do:

self.port.on("get-version", ver => { version = ver; alert(version); });

I get an alert with the version number, but the HTML is still 0.0.0, which I used to define the version variable at the beginning of the content script.

main.js

pageMod.PageMod({
    include: "https://na6.salesforce.com/500?fcf=00B8000000*",
    contentStyleFile: ["./css/salesforceoverlay.css"],
    contentScriptFile: ["./external/jquery/jquery-1.11.3.min.js", "./js/salesforceoverlay.js"],
    onAttach: function(worker) { worker.port.emit('get-version', self.version); }
});

content-script.js

var version = "0.0.0";
self.port.on("get-version", ver => { version = ver; alert(version); });


$("body").append("<div id='helpSection' class='overlay'>\
    <p><b>Salesforce Overlay: " + version + "</b>\

    //more paragraphs/text and such... 

    </p>\
</div>");

Answer 1

Javascript promises were the answer. I have since re-written this to the current web-extensions format so the code is gone, but the issue was with synchronous/asynchronous code. Javascript promises fixed my issue by forcing synchronous behaviour.