Q:

How can I load a new html page and use an element obtained by onclick of a dynamic object?

so on my index.html page i have dynamic objects created by using appendChild and each one of them has an onclick function.  I am able to grab a value when clicked.  but if i want to use this value and show it on another html page, how can i do this?  i am using plain javascript.
from first.js for first html
  var cardTitle = document.createElement("div");
    cardTitle.setAttribute(`onclick`, 'function(this)');
  var title = document.createElement("h2");
    title.textContent = thing.data().title;

  cardTitle.appendChild(title);
  tohtml.appendChild(cardTitle);

from second.js for second html
function function(test){
    window.location.href = "second.html";
    let title = test.firstChild.textContent;
    document.getElementById("id").innerHTML = title;
}

so i honestly dont know if am even suppose to code like this with two js and two html.  i do see some errors here and there but it works.  if there are better ways of doing this, please let me know, if it isnt difficult to apply.
i just have dynamically loaded objects from database loaded on one html and when clicked, i need to grab some values of the clicked object and show them on another html or maybe somehow use them.
so as said, i did get a hold of "thing.data().title" but just cant get it to display on second html.
please help...
thanks in advance!!!

A:

I'm afraid you cannot transfer information from one html page to another that easily.
What you could do however is saving the data in the browser's local storage and retrieve it from there on your second html page.
Here's a sample.
Save this as page1.html
<html>
  <head>
    <script type="text/javascript">
      var text = prompt("Enter some text:");
      localStorage.setItem('myText', text);
    </script>
    <button onclick="window.open('page2.html','_blank')">Click</button>
  </head>
</html>

and this as page2.html
<html>
  <head>
    <script type="text/javascript">
      document.write("You have written: " + localStorage.getItem('myText'));
    </script>
  </head>
</html>

If you open page1 it will prompt you to enter some text. Afterwards push the 'click' button to open page2 in a new browser window where you'll see what you've entered in page1.

