Garmaine Staff asked 2 years ago

I am attempting to make a random sentence generator that samples in a random adjective, noun, and verb in the appropriate place.

The first time, it generates the sentence perfectly and gives the button to generate again. When I click this button though, nothing happens. I'm not sure why.

It would also be better if on the first generation, on the first button click, the sentence simply is added on to what is already there and the text on the button changes to "Generate another" instead of "Generate a sentence." Then, when you click the button again the sentence should automatically change.

If there is anyone who could study my code and help me but that would be great, thank you:

var nouns = ["girl", "boy", "man", "woman", "animal"];
var adjectives = ["giant", "tiny", "funny", "sad", "strange"];
var verbs = ["jumping", "running", "smiling", "exploding", "dying"];

document.write(
  "Welcome to the Useless Random Sentence Generator! More words and combinations will be added in the future. You can always email liorpoliti24@gmail.com for verb, noun, and adjective suggestions as well as other suggestions to make this generator better. Click the button to begin."
);

function randIndex() {
  var randIndex = Math.floor(Math.random() * 5);
  var noun = nouns[randIndex];
  var adjective = adjectives[randIndex];
  var verb = verbs[randIndex];
  var result = "The " + adjective + " " + noun + " is " + verb + ".";
  document.write(result);

  elem = document.createElement("hr");
  elem.setAttribute("width", "500px");
  elem.setAttribute("legth", "8000px");
  document.body.appendChild(elem);

  const btn = document.createElement("button");
  btn.innerText = "Generate Another";
  document.body.appendChild(btn);
  btn.innerText = "Generate Another";
  btn.addEventListener("click", () => {
    randIndex();
  });
}
<button onclick="randIndex();">
   Generate Random Sentence
</button>