The Code

      
        //Entry Point
        function GetValues(){
          //Get the input string
          let inputString = document.getElementById('userString').value;
        
          DisplayString(ReverseString(inputString));
        
        }
        
        //Logic Function
        function ReverseString(stringToReverse){
          let result='';
        
          for(let i=stringToReverse.length-1; i>=0;i--){
            result += stringToReverse[i];
          }  
          return result;
        }
        
        //View Function
        function DisplayString(reversedString){
          document.getElementById('results').textContent = reversedString;
          document.getElementById('alert').classList.remove('invisible');
        
        }
      
    

GetValues()

This function is our entry points and captures the user input, then passes it into our DisplayString() function

ReverseString()

To reverse the string, we decrement our loop though the input starting at the end. As we iterate through each character, that character is appended to the end of our result variable. Once we have fully reversed the string, we return it for the display function to display.

DisplayString()

Once we have gotten our input and reversed the string we can display it to the screen. We grab the results element in the page and set its text contne to our reversed string, then remove the invisible class from the alert to get the window to show.