javascript function not pulling information from API

Question

the function below is not pulling the images from the API. I have double checked everything and make sure there were no error and it is matching the names from the index.html file but still it keeps giving me an error message.

    (function(){
        'use strict';

        $(document).ready(function(){

          $('#getDogButton').click(function(){
            $.get("https://dog.ceo/api/breeds/image/random", function (data) {

              console.log(data);

              const dogUrl = data.message;

              $('#dogDisplayImage').attr('src', dogUrl);

            });
          });


        })

      })();

   the below error message it what I keep seeing when inspecting the console.


ReferenceError: $ is not definedsite.js:4:5
    <anonymous> http://127.0.0.1:5500/site.js:4
    <anonymous> http://127.0.0.1:5500/site.js:21

Looks like you didnt include the jQuery js library (or whatever framework you are using) file in the page, for example `` — Patrick Evans, Jul 03 '19 at 07:54

score 0 · Answer 1 · answered Jul 03 '19 at 07:54

0

Ensure you're importing jQuery correctly - place this in your HTML file:

<script src="https://code.jquery.com/jquery-3.3.1.js"></script>

answered Jul 03 '19 at 07:54

Jack Bashford

43,180
11
50
79

javascript function not pulling information from API

1 Answers1