So I have this piece of code in an html file called demo.html

```
<img class="card-img-top" src="src/San_Francisco_Opera_House.jpg" 
onclick="buyFunction('src/San_Francisco_Opera_House.jpg', 
'SF opera house', 'price: $360,000')" alt="Card image cap">

```

This runs this javascript function which loads a new HTML page. I want to display the image in the new page, 

```
 function buyFunction(housePhotoString, addressString, priceString) {
     $(location).attr('href', 'buy.html');

     houseAttributes.housePhoto = housePhotoString;
     houseAttributes.address = addressString;
     houseAttributes.price = priceString;

     $(document).ready(function() {

         setPicturePriceAndAddress();

     });
 };

 function setPicturePriceAndAddress() {

     let strHTML = "";

     strHTML +=
         +"<img class=\"card-img-top\" src=\"" + houseAttributes.housePhoto + "alt=\"Card image cap\">" +
         "<div class=\"card-block\">" +
         "<h4 class=\"card-title\">" +
         "</i>" + houseAttributes.address + "</h4>" +
         "<p class=\"card-text\">" + houseAttributes.price + "</p>" +
         "</div>";

     $("#housePhotoBuy").html(strHTML);

 };

```

But all the values gets reset. Or is there another way to send information to the new html file without having to save variables?