correct typo in html and get api fetch working

kenyansa · Jul 11, 2023 · 7d0579a · 7d0579a
1 parent aaa8f34
commit 7d0579a
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 1 deletion.
diff --git a/index.html b/index.html
@@ -5,7 +5,6 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>Daily Motivational Quotes</title>
     <link rel="stylesheet" href="styles.css">
-
 </head>
 <body>
     <div class="quote-card">

diff --git a/script.js b/script.js
@@ -1,5 +1,7 @@
 const api_url = "https://api.api-ninjas.com/v1/quotes?category=health"
 const apiKey = 'soP2DeFDH0h3N+n7RWfAiA==7bCg5koQKLpC0Av5'
+const quoteElement = document.getElementById("quote");
+const authorElement = document.getElementById("author");
 
 async function getQuote(url){
     const res = await fetch(url, {
@@ -9,5 +11,9 @@ async function getQuote(url){
     });
     const data = await res.json();
     console.log(data);
+    //set innerHTML of the quote element
+    quoteElement.innerHTML = data[0].quote
+    // Set theinnerHTML of the author element
+    authorElement.innerHTML = data[0].author;
 }
 getQuote(api_url)