What happens to Javascript object created in function, once the function return?

My question is about js object created and stored in function. What do they becomes once the function returns? Here is a code example:

class userInfo {

  constructor(name, age) {
    this.name = name;
    this.age = age;
  }

  function greetings() {
    alert(`Hi, you're name is ${this.name} and you are ${this.age}`);
  }

  function renderUserInfos() {
    const userContent = document.createElement('ul');
    userContent.innerHTML = `
                         <li>${this.name}</li>
                         <li>${this.age}</li>
                         <button>Display User Info </button>
  `
    const displayButton = userContent.querySelector('button');
    displayButton.addEventListener('click',this.greetings.bind(this));
  }
}

function render(name, age) {
 const user = new userInfo(name, age);
 user.renderUserInfos();

 return;
}

render('John',25);

Now I expect the "displayButton" to trigger the "greetings" function, once I’ll click on it.
However, as the "user" object that has been created in the "render" function will be garbage collected once this function will return, how can the "greetings" function be triggered??