Build a Random Quote Machine


#1

I’m working on the “Random quote Generator” but I can’t get my submit button to work. I’m hoping some one can help.
Here is the HTML code:

<div class="container-fluid text-center"> -->
  <h1>Random Quote Generator</h1>
  <p>Some crazy quotes</P>
  <img class="smaller-image" src='//discourse-user-assets.s3.amazonaws.com/original/3X/5/a/5a1d3b899455fdef9ce93e8d90e3fa023a733df6.jpg' alt="null" /> 
  <br/>
  <button type="submit">New Quotes</button>

  <div class="quotes">
    <span class="quote">My quotes</span>
    <span class="author">- Darryl</span>
  </div>
</div>

#2

Could you please link to your project, preferably on CodePen?


#3

To get your button working, you will need to add a click event listener in your JavaScript. Since it’s the only <button> in your HTML, you could simply do:

$('button').on('click', getQuote);

That would make it so the getQuote() function is called every time the button is clicked.

It’s typically a better practice, however, to assign an ID to your button and select it that way to avoid collisions with other buttons if/when you add them to your page.

<button id="newQuoteButton" type="submit">New Quotes</button>
$('#newQuoteButton').on('click', getQuote);

#4

Here is the link you requested: https://codepen.io/DM51Kernahan/pen/OgKELG