Не работают функции slideDown и fadeOut

$(function() { 
  $('h2').hide().slideDown(); 
  var $li = $('li'); 
  $li.hide().each(function(index) { 
    $(this).delay(700 * index).fadeIn(700); 
  }); 
  $li.on('click', function() { 
    $(this).fadeOut(700); 
  }); 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
<div id="page"> 
  <h1 id="header">Список</h1> 
  <h2>Подсписок</h2> 
  <ul> 
    <li id="one" class="hot">Текст 1</li> 
    <li id="two" class="hot">Текст 2</li> 
    <li id="three" class="hot">Текст 3</li> 
    <li id="four">Текст 4</li> 
  </ul> 
</div>