how to replicate jquery functions in javascript $(), Hide()

Question

To create a site, simple in javascript more would like to automate the selection elements, and a function to hide/show the elements. But I end up getting error. But I don’t understand why.

To select the elements I’m using

function $(par){
    return document.querySelector(par)
}

and to hide:

function hide(e){
    return e.style.display = 'none';
}

the declaration shall remain:

$('.header').hide()

only that I am returned the error:

Uncaught TypeError: $(...).hide is not a function

Answer 1

To replicate Jquery functions you can use the prototype, for example to make the Hide function would look like this:

Element.prototype.hide = function(){
   this.style.display = "none";
   return this;
}

With this you are basically including the Hide() method within the Element class.

More about prototypes: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/prototype