I'm doing some review JS work and have a task list that has me stumped.

1. Create a class Image with two properties, imgName and description.
2. Create an image object off the Image class for all images stored in the images folder, and add all of them an array called galleryPhotos.
3. Use a loop to add all images in the galleryPhotos array to the gallery page using DOM node operations. NOTE: innerHTML is not allowed for this task. HINT: Each iteration of the loop will create one img node and add it to the containing element, e.g., main. The loop body would more or less look like below:
   1. Make an img node.
   2. Add the src and alt attributes to the img node, e.g., src: `images/${galleryPhotos[i].name}.jpg`; alt: galleryPhotos[i].description. Here it assumes that a) the image object only has the file name but not the folder name or the file extension; b) the images are stored in the images folder of the website and all have an jpg file extension.
   3. Add the img node to the containing element. The variable referencing the containing element should be created before the loop
4. Add the Gallery link to the site navigation bar using JavaScript.

   NOTE: innerHTML is not allowed for this task.

   The procedure would be similar to creating the gallery page images:
   1. Create an 'a' node, then create and add to it the href attribute and textNode for the clickable text;
   2. create an 'li' node and add the 'a' node to it;
   3. find the first ul element in the nav container or in the document (you may assume the ul in nav is the first ul on the page) then add the 'li' node to the 'ul' container.

I have both an HTML and JS file ready to go and the images in a folder called "imgGallery". I'm just completely stumped on this question/task list.