Trouble Getting Variable from JavaScript getValueForDisplay is not a function

I have some JavaScript that is triggered by a button. The idea is that this JavaScript returns data to the "Result" variable in my course. In the JavaScript the data is being properly passed to the JS variable VarResult. I know this because I have a console.log(VarResult) statement at the end and I can see it in the console. I have an action in the course (button) where OnClick it should Change Contents of a text box called "Transcript" to match the text in the Result variable. When I click this button it throws the following error in the browser and console (showing longer version from console here):

TypeError: VarResult.getValueForDisplay is not a function

at actItem (:295:100)

at p.doAction (trivantis.js:7:18174)

at trivantis-wndobj.js:7:9744

at trivArExec (trivantis-utils.js:7:12234)

at jsWndObj.issueActionsInternal (trivantis-wndobj.js:7:9547)

at jsWndObj.issueActions (trivantis-wndobj.js:7:8644)

at jsWndObj.mouseUp (trivantis-wndobj.js:7:4786)

at jsWndTextButton.mouseUp (trivantis-wndobj.js:7:60566)

at p.processMouseAct (trivantis.js:7:16042)

at p.mouseUp (trivantis.js:7:16748)

Here is the relevant section of the JS code:

for (let i = event.resultIndex; i < event.results.length; ++i) {

if (event.results[i].isFinal) {

final_transcript += event.results[i][0].transcript;

VarResult = final_transcript;

console.log("VarResult: " + VarResult);

}

Note that when I look at the console log I do see "VarResult: The text in the variable".

Does anyone know what I might be doing wrong?