JSFiddle - React, Tailwind, and code Playground
HTML
<body>
<h1>Random Quotes Generator</h1>
<p>Click <strong>Generate</strong> button to see quotes.</p>
<button>Generate!</button>
<script src="script.js"></script>
</body>
JavaScript
var heading = document.querySelector("h1");
var paragraph = document.querySelector("p");
var button = document.querySelector("button");
var last7quotes = [];
var randomQuotes = [
"I am 1st quote.",
"I am 2nd quote.",
"I am 3rd quote.",
"I am 4th quote.",
"I am 5th quote.",
"I am 6th quote.",
"I am 7th quote.",
"I am 8th quote.",
"I am 9th quote.",
"I am 10th quote."
];
var generateQuote = function() {
var quoteToShow = Math.floor(Math.random() * 10);
while(last7quotes.indexOf(quoteToShow) > 0){
quoteToShow = Math.floor(Math.random() * 10);
}
last7quotes.push(quoteToShow);
if(last7quotes.length > 7){
last7quotes.splice(0,1);
}
paragraph.innerHTML = randomQuotes[quoteToShow];
}
button.onclick = generateQuote;