Web Development Problems

In this assignment you need to create an HTML page that meets the following requirements. The theme and content of the page can be of your choice. (1 .htm page/1 .js page)
• Create an HTML form.
• Create and Initialize three arrays.
• Use for-loops to populate those arrays.
• Add an element to the end of one array.
• Remove an element from the end of another array.
• Add a new element to the beginning of one array.
• Add at least one additional array method of your choice.
• Convert an array to a string.
• Use the converted string, assign to a string variable, and use it to populate a form field.
• Create different functions to handle the operations of steps 4, 5, 6, and 7. (You can create additional array methods.)
• Create four or more buttons on the form with different event handlers to start the above functions upon clicking them.
• Create an additional button with an event handler to complete the operation in step 10.

This material may consist of step-by-step explanations on how to solve a problem or examples of proper writing, including the use of citations, references, bibliographies, and formatting. This material is made available for the sole purpose of studying and learning - misuse is strictly forbidden.

var arr1 = [];
var arr2 = [];
var arr3 = [];

function loading(){
    arr1 = [];
    arr2 = [];
    arr3 = [];
   
    for (var i = 0; i < 10 ; i++ ){
       arr1.push(i);
       arr2.push(i*2);
       arr3.push(i*3);
    }

    var element1 = document.getElementById("arr1");
    element1.innerHTML = arr1.toString();
    document.getElementById("arr2").innerHTML = arr2.toString();
    document.getElementById("arr3").innerHTML = arr3.toString();
}

function addToEnd1() {
   arr1.push(document.getElementById("userinput").value);
   var element = document.getElementById("arr1");
    element.innerHTML = arr1.toString();
}...