Random Quote Machine - problem

Hello,
Need a help of Expert:
Why is not display the text (“quotes”) in the “quote-box” ?
Please, do check my functions or there is some connectin errors, between HTML and JS ?
What I`m doing wrong?https://codepen.io/Kingainez/pen/MdYbXW
Many thanks,
Kinga

I can see 3 problems, but you’d still may need to do more to make it fully functional

  1. You need to load jquery in your codepen since you are using it (settings > Javascript > add jquery)
  2. You need to remove these inline onclick js functions below as you are already performing actions in your JS page for those events
<button class="btn btn-primary" id="inspirebtn" onclick="generateQuote">
<button class=" btn btn-primary" id="tweetbtn" onclick="tweetThis">
  1. This below is weird, you need to clean it up, you probably meant to add div tags
      <div class="quote-box">
    <id="quote-text"><i></i>
    
    </id>

Related to what @Dereje1 said in #2 above, you have 3 separate issues:

  • You reference a function (generateQuote) which does not exist anywhere in your code.
  • You only list the function name and do not call it.
  • Because you have wrapped all the functions within the $(document).ready callback function, the calls to the functions are calling functions which are not in the same scope.

Another issue you will realize once you resolve the issues pointed out by @Dereje1, is that you have no styling specified for you div with id=“quote-text”. You have a class defined but no id selector defined.