Документировать события mouseenter / mouseleave на мобильном телефоне

Question

У меня есть 2 функции. в первой функции mouseenter/mouseleave события не обнаруживаются на мобильном телефоне, а во второй функции все работает нормально. Почему вторые функции связывают события на мобильном телефоне, а первые нет?

/*
//does not work on mobile
$(document).on('mouseenter', '.a', function(e) {

  var currentTarget = $(e.currentTarget);

  currentTarget.addClass('b');

}).on('mouseleave', '.a', function(e) {

  var currentTarget = $(e.currentTarget);

  currentTarget.removeClass('b');

});*/

//works on mobile
$(document).find('.a').each(function(e) {

  $(this).on('mouseenter', function(e) {

    var currentTarget = $(e.currentTarget);

    currentTarget.addClass('b');

  }).on('mouseleave', function(e) {

    var currentTarget = $(e.currentTarget);

    currentTarget.removeClass('b');

  });

})

.a {
  width: 200px;
  height: 150px;
  background: red;
  margin-right: 1px;
  float: left;
}

.b {
  background: blue;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<div class="a"></div>
<div class="a"></div>
<div class="a"></div>