diff --git a/README.md b/README.md
index 753c241..492c20b 100644
--- a/README.md
+++ b/README.md
@@ -61,4 +61,6 @@ You have been provided a [JSON object](js/index.js) with all the necessary data
 **Follow these steps for completing your project.**
 
 * [ ] Submit a Pull-Request to merge `<firstName-lastName>` Branch into `main` (student's  Repo). **Please don't merge your own pull request**
-* [ ] Go to the student portal and submit assignment with the link to your branch.
\ No newline at end of file
+* [ ] Go to the student portal and submit assignment with the link to your branch.
+
+<!-- begin lesson -->
\ No newline at end of file
diff --git a/js/index.js b/js/index.js
index dbbab4c..eb748aa 100644
--- a/js/index.js
+++ b/js/index.js
@@ -38,5 +38,108 @@ const siteContent = {
   };
   
   // Example: Update the img src for the logo
+
   let logo = document.getElementById("logo-img");
-  logo.setAttribute('src', siteContent["nav"]["img-src"])
\ No newline at end of file
+
+  logo.setAttribute('src', siteContent["nav"]["img-src"])
+
+
+
+
+  // update nav
+
+  const navbars =document.querySelectorAll("nav a")
+
+navbars.forEach(item =>{
+  navbars[0].textContent = siteContent.nav["nav-item-1"]
+   navbars[1].textContent = siteContent.nav["nav-item-2"]
+   navbars[2].textContent = siteContent.nav["nav-item-3"]
+   navbars[3].textContent = siteContent.nav["nav-item-4"]
+   navbars[4].textContent = siteContent.nav["nav-item-5"]
+   navbars[5].textContent = siteContent.nav["nav-item-6"]
+   
+
+})
+
+  
+
+// selection
+
+const cta =document.querySelector(".cta h1")
+const button =document.querySelector(".cta button")
+const cta_img =document.getElementById("cta-img");
+
+
+// add contant
+
+
+
+cta.textContent = siteContent.cta["h1"]
+button.textContent = siteContent.cta["button"]
+cta_img.setAttribute("src", siteContent["cta"]["img-src"])
+
+
+//selection
+
+const mainContentTitle = document.querySelectorAll(".text-content h4")
+
+const mainContent = document.querySelectorAll(".text-content p")
+
+
+//add Content
+
+mainContent.forEach(element  =>{
+  mainContentTitle[0].textContent = siteContent["main-content"]["features-h4"]
+  mainContentTitle[1].textContent = siteContent["main-content"]["about-h4"]
+  mainContentTitle[2].textContent = siteContent["main-content"]["services-h4"]
+  mainContentTitle[3].textContent = siteContent["main-content"]["product-h4"]
+  mainContentTitle[4].textContent = siteContent["main-content"]["vision-h4"]
+  
+})
+mainContent.forEach(element  =>{
+  mainContent[0].textContent = siteContent["main-content"]["features-content"]
+  mainContent[1].textContent = siteContent["main-content"]["about-content"]
+  mainContent[2].textContent = siteContent["main-content"]["services-content"]
+  mainContent[3].textContent = siteContent["main-content"]["product-content"]
+  mainContent[4].textContent = siteContent["main-content"]["vision-content"]
+  
+})
+
+// console.log(siteContent["main-content"])
+
+
+
+//middle_img selection
+
+const middle_img = document.querySelector("#middle-img")
+middle_img.setAttribute('src', siteContent["main-content"]["middle-img-src"])
+
+console.log(middle_img)
+//contact selection
+
+ const contactTitle = document.querySelector(".contact h4")
+
+ const contact = document.querySelectorAll(".contact p")
+
+
+// add contact
+
+contactTitle.textContent = siteContent["contact"]["contact-h4"]
+
+contact.forEach(element =>{
+  contact[0].textContent = siteContent["contact"]["address"]
+  contact[1].textContent = siteContent["contact"]["phone"]
+  contact[2].textContent = siteContent["contact"]["email"]
+})
+
+
+
+ const footer = document.querySelector("footer p")
+ footer.textContent = siteContent["footer"]["copyright"]
+
+// console.log(siteContent["main-content"]["middle-img-src"])
+
+//   // console.log(navbars)
+
+//   console.log(siteContent["cta"]["img-src"])
+   
\ No newline at end of file