The Code

//entry point AKA controller

function getUserInput() {
    let userInput = document.getElementById('userString').value ;
   revString = reverseTheStringFA(userInput);
   displayString(revString);
}



//logic function
//reverse string



function reverseTheString(string) {

    let revString = '';



    for(let i = string.length - 1; i >= 0; i--) {
           revString += string[i];


    }
    return revString;

}






//view function
function displayString(revString) {
    document.getElementById('results').textContent = revString;
    document.getElementById('alert').classList.remove('invisible');

}

The code is structured in three functions

`getUserInput()`

This function serves as the controller or entry point function. It is responsible for retreiving the user input from the web page. It also creates a variable from the return of the reverseTheString. It also is resposible for passing all the parameters to the other two functions.

`reverseTheString()`

This function is responsible for taking the string passed by the first function and reversing it. The way this functin does this is by first declaring an empty string to house our revesed string created by the following for loop.

The for loop is a 'decrementing' for loop meaning that instead of the index of the for loop starting the scan of the beginning of the array (index 0) it will begin at the end of the array, and decrement the index until it reaches the beginning index of the array. This creates the effect of the for loop scanning the word from the end to the beginning rather than the beginning to the end.

With every loop done by the for loop, the current letter the index is on gets accumulated/totaled/added to the reverseString variable we made to house our reversed string

The reversed string variable is then returned to the controller function

`displayString()`

This function is responsible for displaying the reversed string on the HTML page via a textContent of the elements ID.