var poems = [
"LOW BUDGET LIFE. A 0.99 cent life where love apparently comes a dime a dozen. Diligently I stand against the enemy aforementioned as myself. Mystified to a degree above 90 I wish to melt in your arms but you have an army waiting to take me down.. Only death awaits me.. I'm just wish I could live my life loving you but can I even do that? A disease. Im beat. my feet hurt and I barely eat... Watch me as I deteriorate to the beat in this low budget lifestyle.",
"TOXIC MASCULINITY. We grow to not understand the woes of our own. We fear self expression and hide in our tough little shells that don’t speak. A kiss on the lips can instantly change your sexuality if told about. So you never speak of it and you go about each day holding the secret because consequences of telling would be too grave. But see you hid it from the person you love most and now that you’ve told them too late you’ve dug your own grave. Speak your truth little one for you are big now and have no need to hide under your bed when it storms."
];
function newPoem {
var randomNumber = Math.floor(Math.random() * (poems.length));
document.getElementById('poemDisplay').innerHTML = poems[randomNumber]
}
Try playing with .textContent instead of .innerHTML as it doesn’t look like you’re trying to generate any new HTML, but rather an item from your ‘poems’ array.
I’ve made something similar with quotes. Feel free to take a peek at mine if you’d like to get some ideas.
I tried putting the tag within the JavaScript text like this:
“A 0.99 cent life where love apparently comes a dime a dozen. Diligently I stand against the enemy aforementioned as myself. Mystified to a degree above 90 I wish to melt in your arms but you have an army waiting to take me down… Only death awaits me… I’m just wish I could live my life loving you but can I even do that? A disease. Im beat. my feet hurt and I barely eat… Watch me as I deteriorate to the beat in this low budget lifestyle.”
When you enter a code block into a forum post, please precede it with a separate line of three backticks and follow it with a separate line of three backticks to make it easier to read.
You can also use the “preformatted text” tool in the editor (</>) to add backticks around text.
<!DOCTYPE html>
<html>
<head>
<link rel="Stylesheet" type="text/css" href="poems.css">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>
MoonlitMonolith
</title>
</head>
<body>
<main>
<div class="container">
<div class="quote-section">
<div id="poem"><p>"A test of faith and time is always most difficult when you haven't studied."</p>
</div>
<div id="title">Testing
</div>
</div>
<button type="button" class="btn btn-primary" id="button">
Generate Poem
</button>
</div>
<script>
(function () {
const poems = [
{
poem:
"A 0.99 cent life where love apparently comes a dime a dozen. <br> Diligently I stand against the enemy aforementioned as myself. <br> Mystified to a degree above 90 <br> I wish to melt in your arms but you have an army waiting to take me down.. <br> Only death awaits me.. <br> I'm just wish I could live my life loving you but can I even do that? <br> A disease. Im beat. my feet hurt and I barely eat... <br> Watch me as I deteriorate to the beat in this low budget lifestyle.",
title:
"LOW BUDGET LIFE."
},
{
poem:
"We grow to not understand the woes of our own. We fear self expression and hide in our tough little shells that don’t speak. A kiss on the lips can instantly change your sexuality if told about. So you never speak of it and you go about each day holding the secret because consequences of telling would be too grave. But see you hid it from the person you love most and now that you’ve told them too late you’ve dug your own grave. Speak your truth little one for you are big now and have no need to hide under your bed when it storms.",
title:
" TOXIC MASCULINITY."
}
];
const btn = document.getElementById("button")
btn.addEventListener("click", function() {
let random = Math.floor(Math.random() * poems.length);
document.getElementById("poem").innerHTML = poems[random].poem;
document.getElementById("title").innerHTML = poems[random].title;
});
})();
// document.getElementById("myBtn").addEventListener("click", function() {
// document.getElementById("demo").innerHTML = "Hello World";
// });
(function () {
const poems = [
{
poem:
"A 0.99 cent life where love apparently comes a dime a dozen. <br> Diligently I stand against the enemy aforementioned as myself. <br> Mystified to a degree above 90 <br> I wish to melt in your arms but you have an army waiting to take me down.. <br> Only death awaits me.. <br> I'm just wish I could live my life loving you but can I even do that? <br> A disease. Im beat. my feet hurt and I barely eat... <br> Watch me as I deteriorate to the beat in this low budget lifestyle.",
title:
"LOW BUDGET LIFE."
},
{
poem:
"We grow to not understand the woes of our own. We fear self expression and hide in our tough little shells that don’t speak. A kiss on the lips can instantly change your sexuality if told about. So you never speak of it and you go about each day holding the secret because consequences of telling would be too grave. But see you hid it from the person you love most and now that you’ve told them too late you’ve dug your own grave. Speak your truth little one for you are big now and have no need to hide under your bed when it storms.",
title:
" TOXIC MASCULINITY."
}
];
const btn = document.getElementById("button")
btn.addEventListener("click", function() {
let random = Math.floor(Math.random() * poems.length);
document.getElementById("poem").textContent = poems[random].poem;
document.getElementById("title").textContent = poems[random].title;
});
})();
// document.getElementById("myBtn").addEventListener("click", function() {
// document.getElementById("demo").innerHTML = "Hello World";
// });
</script>
</main>
</body>
</html>
I made the corrections, but it’s still happening. I will try anything you suggest.
Wait. I realized I accidentally added the scripting twice. I deleted the copy, tried it again and it worked! THANK YOU, THANK YOU for being so patient with me. I have learned a lot. My next goal is to tweak the formatting and spacing a bit and add the rest of the poems.