Hello everyone! In this short article, I want to show you my implementation of fadeIn() and fadeOut() functionality from JQuery in pure JavaScript. JQuery was a great JavaScript wrapper with a lot of very useful functionality and it still in use, but as the time goes by it starts to become obsolete.

Today we have beautiful transitions and extended JavaScript functionality already built into modern web browsers, so we just don't need jQuery anymore. We can do the same with less JavaScript wrappers and better efficiency. For AJAX requests there are also better libraries such as Axios for example.

I use transitions and clone functionality to update DOM model with one additional custom Sleep function. Beware - if you use event binding, you will lose all your events in the target element. Here is my source code: