fade in and fade out in pure javascript without jquery

Here I have a function that fades a square box with id="box" as soon as the page loads. I tried but failed to find out how to fade in the box again or simply how to fade in a box or an element with pure JavaScript not jQuery. Here is my code for fadeOut() function:

var box = document.getElementById('box');

function fadeOut(elem, speed)
        {

        if(!elem.style.opacity)
        {
                elem.style.opacity = 1;
        }
        setInterval(function(){

 elem.style.opacity -= 0.02;
 
        }, speed /50);
}

fadeOut(box, 2000);

#box
{
  width: 100px;
  height: 100px;
  background-color: blue;
  }

<div id="box"></div>

Many thanks in advance to contributors. cheers