How do I get a JS function resut to a HTML form?

I'm trying to build an app in js that would get a random question from an array that would combine with a random object from another array. So my app looks like this:

    Array.prototype.random = function (length) {
       return this[Math.floor(Math.random()*length)];
 };



var country = [
    {name:"Romania", capital: "Bucuresti"},
    {name: "Bulgariei", capital: "Sofia"}
    ];
    chosen_country = country.random(country.length);


var questions = [
    "Which is the capital of ",
    " is the capital of which country?"
];

var chosen_question = questions.random(questions.length);


function q() {
    chosen_country;
    chosen_question;
    if(chosen_question == questions[0]){
         return chosen_question + chosen_country.name + "?";
    } else if(chosen_question == questions[1]){
        return chosen_country.capital + chosen_question;
    }

    }
q();

So my app will generate a random question from the questions array and combine it with a random object from the country array:

1. "Which is the capital of 'country x' ?"


2. "'Capital x' is the capital of which country?"

I would like to know how get the random question generated with a button form in HTML. Afterwords I would like to answer the question within an input form and send the answer to be use in another function to check if the answer is corector not. Anyone having any idea? I have tried to use document.getElementById("que").innerHTML = q(); but I realy don't know how to use it properly. Is ther any other solutin or i could use some explenations how to use .innerHTLM