for on array to display pizza

src/main.js

-const name = "Regina",
-    url = `images/${name.toLowerCase()}.jpg`,
-    html =
-`<article class="pizzaThumbnail">
+const data = ['Regina', 'Napolitaine', 'Spicy'];
+
+/*
+const html = data.map(name => {
+    const url = `images/${name.toLowerCase()}.jpg`;
+
+    return `<article class="pizzaThumbnail">
+                <a href="${url}">
+                    <img src="${url}" alt="${name}"/>
+                    <section>${name}</section>
+                </a>
+            </article>`;
+
+});
+
+html.forEach(element => document.querySelector('.pageContent').innerHTML += element);
+*/
+
+/*
+data.forEach(name => {
+    const url = `images/${name.toLowerCase()}.jpg`;
+
+    document.querySelector('.pageContent').innerHTML += `<article class="pizzaThumbnail">
                 <a href="${url}">
                     <img src="${url}" alt="${name}"/>
                     <section>${name}</section>
                 </a>
             </article>`;
+});
+ */
+
+const tohtml = name => {
+    const url = `images/${name.toLowerCase()}.jpg`;
+
+    return `<article class="pizzaThumbnail">
+                <a href="${url}">
+                    <img src="${url}" alt="${name}"/>
+                    <section>${name}</section>
+                </a>
+            </article>`;
+};
+
+const reducer = (previous, current, index) => {
+    if(index === 1) previous = tohtml(previous);
+
+    return previous + tohtml(current);
+};
+
+
+const html = data.reduce(reducer);
 
 console.log(html);
 document.querySelector('.pageContent').innerHTML = html;
\ No newline at end of file