How can i load an API call for this weather API to display inside a div in my html page

Question

I have this weather API plugin and my api key and i would like to show the data it displays inside a div. RIght now if i enter this link into my browser it shows me the correct weather info. My question is how do i get this data to display in a div in my web page.

API call (link): http://api.openweathermap.org/data/2.5/weather?q=Montreal&mode=html&appid=4a5344b7f84ba5c5c620525315413734

If you enter this link above in any browser it will work.

I haven't tried anything because its just a link, so obviously adding it anywhere on my page doesn't make sense. I think this has something to do with a GET request perhaps...?

Answer 1

Here is a basic example from your post.

 $(function() { $(".weatherbug > div:eq(1)").load("https://api.openweathermap.org/data/2.5/weather?q=Montreal&mode=html&appid=4a5344b7f84ba5c5c620525315413734"); });

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div class="weatherbug"> <div>My Weather</div> <div></div> </div>