diff --git a/Sprint-3/reading-list/index.html b/Sprint-3/reading-list/index.html
index dbdb0f47..c67805f5 100644
--- a/Sprint-3/reading-list/index.html
+++ b/Sprint-3/reading-list/index.html
@@ -4,7 +4,7 @@
- Title here
+ Reading list app
diff --git a/Sprint-3/reading-list/script.js b/Sprint-3/reading-list/script.js
index 6024d73a..8f3b1e20 100644
--- a/Sprint-3/reading-list/script.js
+++ b/Sprint-3/reading-list/script.js
@@ -21,3 +21,33 @@ const books = [
},
];
+const readingList = document.getElementById("reading-list");
+function populateBooks(bookArray) {
+
+ bookArray.forEach(item => {
+
+ const listItem = document.createElement("li");
+ const div = document.createElement("div");
+ const title = document.createElement("h2");
+ const author = document.createElement("h3");
+ const image = document.createElement("img");
+ let colour = "red";
+ if (item.alreadyRead === true) {
+ colour = "green";
+ }
+ title.textContent = item.title;
+ author.textContent = item.author;
+ image.src = item.bookCoverImage;
+ readingList.style.textAlign = "center";
+ div.style.backgroundColor = colour;
+ div.style.maxWidth = "500px";
+ image.style.width = "200px";
+ readingList.appendChild(listItem);
+ listItem.appendChild(div);
+ div.appendChild(title);
+ div.appendChild(author);
+ div.appendChild(image);
+ });
+}
+
+populateBooks(books);
\ No newline at end of file