Global Count Variable not increasing

For some reason, I cannot get my global variable counter to increase, even when it increases within the function I have the count++ occurring in. My outputted results are different between the text outputted within the function and the text outside of it. Any idea what I am doing wrong here? Shouldn’t the count increase on each iteration of the survey.oncomplete function results?

Survey
    .StylesManager
    .applyTheme("modern");

var kn2 = "LwrHXqFRN_pszCopTKHF_Q"
var kn3 = "exroCUoYl4wVzs7pKU_49w"

var count = 0

var keyname = ("kn" + count)

var mapilink = "https://images.mapillary.com/" + (keyname) + "/thumb-1024.jpg";

var json = {
 pages: [
  {
   name: "page1",
   elements: [
    {
     type: "image",
     name: "image",
     imageLink: (mapilink),
     imageHeight: 580,
     imageWidth: 640
    },
    {
     type: "html",
     name: (keyname),
     visible: false,
     html: (keyname)
    },
    {
     type: "rating",
     name: "Walkability",
     title: "How walkable does this look to you"
    },
    {
     type: "rating",
     name: "Saftey",
     title: "How safe does this look to you"
    },
    {
     type: "rating",
     name: "Comfortability",
     title: "How comfortable does this look to you"
    }
   ]
  }
 ]
}

window.survey = new Survey.Model(json);

var username = document.getElementById("user").value;

survey
    .onComplete
    .add(function (result) {
        count ++;
        var PID = document.getElementById("user").value;
        var results = PID + "_" + (keyname) + ":n" + JSON.stringify(result.data, null, 3) + (count) ;
        document
            .querySelector('#surveyResult')
            .textContent = results;
    survey.clear();
    survey.render();
    });

$("#surveyElement").Survey({model: survey});

Answer

Got an answer from a seperate stackexchange post – basically, I needed to wrap everything in more functions.

function outputting function text rather than expected output