Hi, I’m having trouble getting my quote machine to loop through my array and display new quotes. I hard coded a few quotes and authors because i still haven’t wrapped my head around getting quotes from apis.
Feel free to take a look at my code pen link and offer any advice or suggestions .
Thanks in advance!
When you click the “Get New Quote” button, what are you hoping to see on the screen?
To start there is an error in your logic: the for loop in your click handler instantly cycles to the end so we can only see the Steve Jobs quote.
Here’s a forked pen:
var index =0; // Let's show a quote on page load
$("#newQuote").html('"' + quotes[index].quote + '"');
$("#author").html("-" + quotes[index].author + "-");
$("#quotes").on("click", function(){
if(index < quotes.length-1){ // if the index is less than the length
index++; // Increment
} else{ index =0;} // Otherwise start at the beginning
$("#newQuote").html('"' + quotes[index].quote + '"'); //Update the text regardless
$("#author").html("-" + quotes[index].author + "-");
});
1 Like
There’s a few issues going on.
-
First of all there’s an error in the console, You need to include jQuery before Bootstrap’s js as Bootstarp’s js depends on jQuery.
-
You currently loop until quotes.length+1, the condition should be quotes.length
1 Like
Thanks for the quick response. Taking a look now.
Hi, Thank you. Checking it out now.