How to change global variable with addEventListener?

I’m trying to change the userSelection variable with addEventListener. Nothing is showing up from the console.log at the bottom, but I get the desired result when placed in the button variables. I understand that it becomes local when inside the buttons instead of global, but have confusion on how addEventListener works.

var userSelection = "";
var rock = document.querySelector('#rock');
var paper = document.querySelector('#paper');
var scissors = document.querySelector('#scissors');

rockButton = rock.addEventListener('click', e => {
  userSelection = "Rock"
})

paperButton = paper.addEventListener('click', e => {
  userSelection = "Paper"
})

scissorButton = scissors.addEventListener('click', e => {
  userSelection = "Scissors"
})

console.log(userSelection);

Any help or pointer in the right direction would be greatly appreciated!