Jquery and getting a value from an input using .value

const $ = selector => document.querySelector(selector); const numInput = $('#numInput'); $('#submit1').addEventListener("click", () => { console.log(numInput.value); });

Vs

const $ = selector => document.querySelector(selector); const numInput = $('#numInput').value; $('#submit1').addEventListener("click", () => { console.log(numInput); });

I dont quite understand why the 2nd snippet doesn’t work. Since ‘click’ runs after each event, even if it didn’t have a value to start with, once you add something and press click, it shows an empty line on the console