Random Phrase Generator not showing Phrases
Attempting to create a Random Phrase Generator, for a project, am getting this error in my app.js file : parsing error:
"Lets Get Wild"
"Irrelevant Streamer Love me?"
"It's a wonderful day to rage at Game Name Gere"
"I have no life"
"Tired Tuesday"
Full code for JavaScript and HTML has been included below.
Java
var quotes ={
"Let's Get Wild"
"Irrelevant Streamer, Love me?"
"It's a wonderful day to rage at 'Insert Game name Here'"
"I have no life"
"Tired Tuesday"
"Spreading Positivity"
"Good Vibes only here"
"I'm on the Team"
"What gets you up and motivated in the morning?"
"What's your favourite Song to Scream/Sing along to?"
"UwU or OwO??"
"No More Nice 'Insert Streamer name'"
"Cruisin' for a Brusin'"
"Cherish your loved ones"
"Playing with myself, come watch?"
"The Best Bottom Fragger ever"
"10 reason's I know you left your clothe's in the Dryer"
"Trying not to suck"
"#1 Undefeated 'Insert what Character is called'"
"Seek Success, prepare for Loss"
"You are the only one who matters to me"
"Let's take over the world"
"1 World to rule "
"(*´ω`*)"
"1 Streamer to rule the world"
"Before Slaughter, Comes streams"
"Keep Scrolling, nothing to see here"
"Don't argue with Success"
"If one wants to rule the world, this stream is the place to start",
"You don't need social acceptance to be here!"
"Viewers deny watching😉"
"The greatest discovery of this generation is me"
"We all make mistakes"
"Give me the fuel to stream"
//."Have a problem? I'm the Solution:
//."Who needs skill when you have luck?"
//."Who needs luck when you have skill?"
//."The most important thing is my stream"
//."Do I dare to Achieve Greatly?"
//."There's a reason that roses have thorns"
//."There are few things better in life than 'Streamer name here'"
//."Please wait inside the stream"
//."Instead of a Party, Chill here instead"
//."If any cop asks where you were, just say here"
//."There are over 500 Starfish in the Computer"
//."I have a spot Reserved for you here"
]
function getQuote() {
var randomNumber = Math.floor(Math.random() * quotes.length)
document.getElemntById('newQuoteSection').innerHTML = quotes[randomNumber];
}
HTML
<html lang="en"
<head>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.min.js" integrity="sha384-QJHtvGhmr9XOIpI6YVutG+2QOK9T+ZnN4kzFN1RtK3zEFEIsxhlmWl5/YESvpZ13" crossorigin="anonymous"></script>
<title> Random Stream Title Generator</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<div class="container">
<div class="row flex-top justify-content-center">
<header class="border shadow">
<h1> Random Stream Title Generator </h1>
</header>
</div>
</div>
<div class="row flex-top justify-content-center">
<button id="button" class="btn-large new-quote-button" onClick="getQuote()">Generate Stream Title</button>
</div>
<div class="row justify-content-center">
<main class="card">
<p class="quote card-body center" ud="newQuoteSection">Stream Title Appears Here</p>
</main>
</div>
<script src="app.js"></script>
</body>
</html>
Edit : I have switched to square brackets and added the comma's however, the button won't click when attempting to click, as well as have corrected spelling error's in App.js and index.html
var quotes = [
"Let's Get Wild",
"Irrelevant Streamer, Love me?",
"It's a wonderful day to rage at 'Insert Game name Here'",
"I have no life",
"Tired Tuesday",
"Spreading Positivity",
"Good Vibes only here",
"I'm on the Team",
"What gets you up and motivated in the morning?",
"What's your favourite Song to Scream/Sing along to?",
"UwU or OwO??",
"No More Nice 'Insert Streamer name'",
"Cruisin' for a Brusin'",
"Cherish your loved ones",
"Playing with myself, come watch?",
"The Best Bottom Fragger ever",
"10 reason's I know you left your clothe's in the Dryer",
"Trying not to suck",
"#1 Undefeated 'Insert what Character is called'",
"Seek Success, prepare for Loss",
"You are the only one who matters to me",
"Let's take over the world",
"1 World to rule ",
"(*´ω`*)",
"1 Streamer to rule the world",
"Before Slaughter, Comes streams",
"Keep Scrolling, nothing to see here",
"Don't argue with Success",
"If one wants to rule the world, this stream is the place to start",
"You don't need social acceptance to be here!",
"Viewers deny watching😉",
"The greatest discovery of this generation is me",
"We all make mistakes",
"Give me the fuel to stream"
//."Have a problem? I'm the Solution"
//."Who needs skill when you have luck?"
//."Who needs luck when you have skill?"
//."The most important thing is my stream"
//."Do I dare to Achieve Greatly?"
//."There's a reason that roses have thorns"
//."There are few things better in life than 'Streamer name here'"
//."Please wait inside the stream"
//."Instead of a Party, Chill here instead"
//."If any cop asks where you were, just say here"
//."There are over 500 Starfish in the Computer"
//."I have a spot Reserved for you here"
];
function getquote() {
var randomNumber = Math.floor(Math.random() * quotes.length);
document.getElementById("newQuoteSection").innerHTML = quotes[randomNumber];
}
Edit 2:
Changed var quotes = [
to
let quotes = [
Thank you everyone that Helped with the fixing this problem, Greatly Appreciated!!!!
Solution 1:
There are 3 issues :
1/ quotes is an object you want an array, and it's to be declared :
var quotes = [
"first quote",
"second quote",
...
"last quote",
] ;
[] , not {} and don't forget the commas
2/ there is a typo :
getElemntById should be getElementById
3/ And then in html you wrote ud instead of id
Working code :
var quotes =[
"Let's Get Wild",
"Irrelevant Streamer, Love me?",
"It's a wonderful day to rage at 'Insert Game name Here'",
"I have no life",
"Tired Tuesday",
"Spreading Positivity",
"Good Vibes only here",
"I'm on the Team",
"What gets you up and motivated in the morning?",
"What's your favourite Song to Scream/Sing along to?",
"UwU or OwO??",
"No More Nice 'Insert Streamer name'",
"Cruisin' for a Brusin'",
"Cherish your loved ones",
"Playing with myself, come watch?",
"The Best Bottom Fragger ever",
"10 reason's I know you left your clothe's in the Dryer",
"Trying not to suck",
"#1 Undefeated 'Insert what Character is called'",
"Seek Success, prepare for Loss",
"You are the only one who matters to me",
"Let's take over the world",
"1 World to rule ",
"(*´ω`*)",
"1 Streamer to rule the world",
"Before Slaughter, Comes streams",
"Keep Scrolling, nothing to see here",
"Don't argue with Success",
"If one wants to rule the world, this stream is the place to start",
"You don't need social acceptance to be here!",
"Viewers deny watching😉",
"The greatest discovery of this generation is me",
"We all make mistakes",
"Give me the fuel to stream",
//."Have a problem? I'm the Solution"
//."Who needs skill when you have luck?"
//."Who needs luck when you have skill?"
//."The most important thing is my stream"
//."Do I dare to Achieve Greatly?"
//."There's a reason that roses have thorns"
//."There are few things better in life than 'Streamer name here'"
//."Please wait inside the stream"
//."Instead of a Party, Chill here instead"
//."If any cop asks where you were, just say here"
//."There are over 500 Starfish in the Computer"
//."I have a spot Reserved for you here"
] ;
function getQuote() {
var randomNumber = Math.floor(Math.random() * quotes.length) ;
document.getElementById('newQuoteSection').innerHTML = quotes[randomNumber];
}
getQuote() ;
<html lang="en"
<head>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.min.js" integrity="sha384-QJHtvGhmr9XOIpI6YVutG+2QOK9T+ZnN4kzFN1RtK3zEFEIsxhlmWl5/YESvpZ13" crossorigin="anonymous"></script>
<title> Random Stream Title Generator</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<div class="container">
<div class="row flex-top justify-content-center">
<header class="border shadow">
<h1> Random Stream Title Generator </h1>
</header>
</div>
</div>
<div class="row flex-top justify-content-center">
<button id="button" class="btn-large new-quote-button" onClick="getQuote();">Generate Stream Title</button>
</div>
<div class="row justify-content-center">
<main class="card">
<p class="quote card-body center" id="newQuoteSection">Stream Title Appears Here</p>
</main>
</div>
</body>
</html>