// get the string from the page.
function getString(){
    document.getElementById("alert").classList.add("invisible");

    let userString = document.getElementById("userString").value;

    let revString = reverseString(userString);
    displayString(revString);
}



// reverse the string.
function reverseString(userString){

    let revString = "";


    // reverse a string using a for loop
    for (let index = userString.length - 1; index >= 0; index--) {

        revString += userString[index];
    }

    return revString;
}



// display the reverse string.
function displayString(revString){
    // write to the DOM
    document.getElementById("message").innerHTML = `Your string reversed is: ${revString}`;

    // show the alert box
    document.getElementById("alert").classList.remove("invisible");
}

Back to the front is a coding excerise in JavaScript where you enter a string and the program reverses it. It includes three functions. getString(), reverseString(), and displayString().

getString()

This function gets the string from the document object model.

reverseString()

This function uses a for loop to loop backwards through the string adding it to a new string variable as it goes.

displayString()

This function sets the innerHTML of a p tag in the document object model and shows the alert box.