'How can i pass data forward base upon what the user clicks on?

I've been testing out fetching data from a stock API and I'm displaying the ticker symbol and name on my page, However, I want to expand a bit and when I click on each stock I would like for a page to open and display more data on that stock. So my approach to the problem is to have a function perform a request using the ticker symbol as the argument when the detail page opens. But my question is how do I pass the ticker forward to my function. Can someone help?

// Fetch stock- this function runs on page load
async function fetchTrendingStock() {
    fetch(trendUrl)
     .then(response => {
         if(!response.ok) {
             throw new Error(`HTTP error! Status: ${response.status}`);
         }
         return response.json();
     })
     .then(data => {
         console.log(data)
         let trend = "";
         let payload = data.data.all;
         for(let i = 0, len = payload.length; i < len; i++) {
            trend += 
            `   
                <div class="col-lg-6">


                <a class="cardLink"  href="details.html">


                        <div class="newsCard">
                            <div class="text-container">
                                <h4 class="cardText">${payload[i].name}</h4>
                                <h5 class="cardText">${payload[i].ticker}</h5>
                            </div>

                            <div class="imgContainer">
                                <p class="">${payload[i].sentiment_score}</p>
                            </div>
                        </div>

                </a>

                </div>

            `
         }
         document.getElementById("trend-stocks-container").innerHTML = trend;

     })
}
fetchTrendingStock()


// fetch stock details- this function will run when the link to the stock is clicked to open the detail page.
 async function fetchProfileData(ticker) {
        let url = `https://financialmodelingprep.com/api/v3/profile/${ticker}?apikey=0000`;

        fetch(url)
         .then(response => {
            if(!response.ok) {
             throw new Error(`HTTP error! Status: ${response.status}`);
            }
            return response.json();
         })
         .then(data => {
             console.log(data)
             data.forEach(payload => {
                 console.log(payload.companyName)
                 console.log(payload.description)
             })
         })
    }
    fetchProfileData("eman")


Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source