✏️ Explanatory Question
1. jQuery Hands-on 5 - AJAX
Write a function load_des() which can load content for the div tag #item1-des from the URL: "https://gist.githubusercontent.com/frescoplaylab/845 8dd75a120cf0cfbdf45be813d8f03/raw/84784527d760e f1f877f0b4bb02a3a5e12e32f4c/file.html".
<html>
<head>
<link rel="stylesheet" type="text/css" href="style.css">
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="index.js"></script>
</head>
<body onload="load_des()">
<div class="topnav">
<a href="#" style="float:right;font-size:20px"><i>Check out</i></a>
<a href="#" style="float:right; font-size:20px"><i>Sign In</i></a>
<a href="#/Home" style="float:left; width:150px;" class="active"><b><i>Pick2get</i></b></a>
</div>
<br />
<br />
<div class="product_box" id="item1" onmouseover="hover1()">
<div class="single_1">
<div class="container">
<img src="img/dummy_product.jpg" />
</div>
</div>
<div class="single_2">
<div class="prod_desc">
<div class="pdt_details_2_col">
<span class="brand">Brand</span>
</div>
<div class="pdt_details_2_col">
<span class="brand">Price</span>
</div>
</div>
</div>
<div class="single_3">
<div class="quantity_sec">
<label>Quantity</label>
<br>
<input placeholder="Quantity" type="number">
</div>
</div>
<div class="single_4">
<input type="image" src="img/orangeCart.png" alt="Submit" width="48" height="48"/>
</div>
</div>
<div id="item1-des" class="des">
Some Description 1
</div>
<div class="product_box" id="item2" onmouseover="hover2()">
<div class="single_1">
<div class="container">
<img src="img/dummy_product.jpg" />
</div>
</div>
<div class="single_2">
<div class="prod_desc">
<div class="pdt_details_2_col">
<span class="brand">Brand</span>
</div>
<div class="pdt_details_2_col">
<span class="brand">Price</span>
</div>
</div>
</div>
<div class="single_3">
<div class="quantity_sec">
<label>Quantity</label>
<br>
<input placeholder="Quantity" type="number">
</div>
</div>
<div class="single_4">
<input type="image" id="img2" src="img/orangeCart.png" alt="Submit" width="48" height="48"/>
</div>
</div>
<div id="item2-des" class="des">
Some Description 2
</div>
<br />
<button class="buy" id="buy" onmouseover="big()">BUY</button>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script type="text/javascript" src="index.js"></script>
</body>
</html>
script.js
function load_des() {
$("#item1-des").load("https://gist.githubusercontent.com/frescoplaylab/8458dd75a120cf0cfbdf45be813d8f03/raw/84784527d760ef1f877f0b4bb02a3a5e12e32f4c/file.html");
};