When I press a button on my main page, it retrieves a link to an image using an api. Then I want to redirect to another page of mine and change the src attribute to the link i fetched with the api (on the new page).

Everything works besides the change image source.

Main page button:

<button onclick="search()" class="submit-button">SEARCH</button>

Java Script (Edit: JavaScript is stored in separate file 'script.js')

function search() {
    const username = document.getElementById("username").value

    // API CALL HERE WHICH CALLS presentImg()

}

function presentImage(url) {
    console.log(url)
    window.location.replace("profile.html")

    document.getElementById("image").src = url;

}

Profile.html

<img id="image" src="#">

When I open the main page and click the button I am redirected and the profile.html page opens but the image is not displayed. I have already checked the url, it works and shows only one image. I also tried to load a local image in my project folder, that doesn't work either.