Use JavaScript, Local Storage, simple JSON retrieval and AJAX calls for the Following:

Inside of the initial .js file:

1.) Get the First Name field using query selector only 2. Get the Last Name field using classname only 3) Get the option value using id only 4) On submit in index.html (invoke the JavaScript function submitted()), Store all the values in local storage. and jump to 2nd .html file

Inside of the 2nd html file: call the JavaScript method loading()

1) Fetch the department name from local storage and show it in the header tag h1. Please use template literals to show the message Welcome to the departmentname department where department name is supposed to be replaced by the actual department name. 2) Pull the description of the department from options.json file in the data folder using XMLHttpRequest and show it in

using innerText. 3) Set the header for the course list (h3) using query selector and innerHTML. Make sure that the entire header is italicized. 4) Fetch the courseList from courses.json file in data folder using Fetch method and display the courses in the form of unordered lists

.

Relevant File Source Code is Provided Below

---------------------------------------------------------------------------------------------

HTML Page 1

Contact Form

First Name

Last Name

Department Computer Mechanical Electrical

---------------------------------------------------------------------------------------------

HTML Page 2

---------------------------------------------------------------------------------------------

Courses JS File

{ "courses": [ { "name": "computer", "courseList": [ "Algorithmic Design", "Web Programming", "Operating Systems" ] }, { "name": "mechanical", "courseList": ["Thermodynamics", "Fluid Mechanics", "Automotive design"] }, { "name": "electrical", "courseList": [ "Control System Engineering", "Engineering Electromagnetics", "High Voltage Engineering" ] } ] }

-------- Options JS File

{ "options": [ { "name": "computer", "description": "Welcome to the Computer Science department" }, { "name": "mechanical", "description": "Welcome to the Mechanical Engineering department" }, { "name": "electrical", "description": "Welcome to the Electrical Engineering department" } ] }