Earlier quoted context omitted.
To use an example, I'd much rather do $(".elements").css("color", "red") versus var selector = document.getElementsByClassName('elements'); selector.style.color = 'red';
You can do const $ = document.querySelector; $('.elements').style.color = 'red'; Which is only marginally more verbose.
const $ = document.querySelector.bind(document);
or slightly less efficient, wrap in a function: const $ = function(x) { return document.querySelector(x) };
or if you want to be concise and don't need to support legacy IE: const $ = (x) => document.querySelector(x);
(and as pointed out already, you need querySelectorAll() and a loop for what jQuery does by default, though your example will work for a single element)