Receiving an error of "null" when running HTML "Form a Story Project"

Hi there, I am getting an error when running my code. When I try to run the story, it says ___ replied the ____, "and I get there NULL than you think. I’m guessing an error was made on the line of code I made in bold with *. Appreciate it if someone could assist me in solving this error :slight_smile:

Form a Story Form A Story Logo
<section id="main">
  <h1>
    Complete the Form -<br />
    Complete the Story!
  </h1>
  <hr />
  <!--Add your form below:-->
  <form action="story.html" method="GET">
    <label for="animal-1">Animal:</label>
    <input id="animal-1" name="animal-1" type="text" required />
    <br />

    <label for="animal-2">Another Animal:</label>
    <input id="animal-2" name="animal-2" type="text" required />
    <br />

    <label for="animal-3">One More Animal:</label>
    <input id="animal-3" name="animal-3" type="text" required />
    <br />

    <label for="adj-1">Adjective (past tense):</label>
    <input id="adj-1" name="adj-1" type="text" required />
    <br />

    <label for="verb-1">Verb (ends in -ing:)</label>
    <input id="verb-1" name="verb-1" type="text" required />
    <br />

    <label for="num-1">Number:</label>
    <input id="num-1" name="num-1" type="text" required />
    <br />

    <span>Yes or No:</span>
    <input id="yes" type="radio" name="answer" value="yes" required />
    <label for="yes">Yes</label>

    <input id="no" type="radio" name="answer" value="no" />
    <label for="no">No</label>
    <br />

ERROR STARS HERE MAYBE?

    <label for="speed">Relative speed (ends in -er)</label>
    <select id="speed" required>
      <option value="faster">Faster</option>
      <option value="slower">Slower</option>
      <option value="higher">Speedier</option>
    </select>
    <br />

    <label for="quote">Motivational Quote</label>
    <input
      id="quote"
      name="quote"
      type="text"
      list="quote-choices"
      required
    />

    <datalist id="quote-choices">
      <option value="codecademy"></option>
      <option value="code"></option>
      <option value="example"></option>
    </datalist>
    <br />

    <label for="message">Meaningful Message</label>
    <textarea
      id="message"
      name="message"
      rows="8"
      cols="40"
      required
    ></textarea>
    <br />

    <input type="submit" value="Form My Story!" />
  </form>
</section>

maybe putting default values using the value attribute would help for inputs with id “animal-1” and “animal-2”
you could also have a radio button/circle checked by default by using the checked attribute.