FadeIn and FadeOut Sound

HTML

<div class="rain-play">
Click to fadeIn sound
</div>

<div class="rain-pause">
Click to fadeOut Sound
</div>

<audio id="dv-rain" preload="auto">
    <source src="https://speed.idmp3s.com/ruWBZB:hkU3rB" type="audio/mpeg" />
	</audio>

CSS

.rain-play {
  display: block;
  background-color: #000;
  color: #fff;
  margin: 2vh;
  padding: 2vh;
  cursor: pointer;
  font-size: calc(14px + 0.5vw);
}

.rain-pause {
  display: block;
  background-color: #000;
  color: #fff;
  margin: 2vh;
  padding: 2vh;
  cursor: pointer;
  font-size: calc(14px + 0.5vw);
}

JavaScript

/* control interval variables */
  var pauseInterval;
  var playInterval;
  
 /* audio variable */
  var audio = $('#dv-rain').get(0);
  

/* Play on Click */
$('.rain-play').unbind().click(function() {
    playInterval = setInterval(fadeInSound, 10); 
    audio.play();
});
/* fadeOut on Click */
$('.rain-pause').unbind().click(function() {
  var pauseInterval = setInterval(fadeOutSound, 10);

});

/* fadeIn function */
function fadeInSound() {
  var volumeControl =  Math.min(audio.volume + 0.01, 1);
  if (volumeControl <= 1.0) {
      audio.volume = volumeControl;
      volumeControl++;
       console.log(volumeControl);
  } else {
    clearInterval(playInterval);
    clearInterval(pauseInterval);
  }
}
/* fadeOut function */
function fadeOutSound() {
  var volumeControl =  Math.min(audio.volume - 0.01, 1);
  if ((volumeControl >= 0.0) && (volumeControl <= 1.0))   {
      audio.volume = volumeControl;
      volumeControl--;
      console.log(volumeControl);
  } else {
    clearInterval(playInterval);
    clearInterval(pauseInterval);
  }
}