Как заставить эффект наведения мыши JQuery работать в iOS

В настоящее время я работаю над грубым прототипом временной шкалы для инструмента онлайн-планирования. Люди должны иметь возможность указать их доступность, зависая над временной шкалой:

9.00-10.00 | 10.00-11.00 | и т.п.

Когда вы наводите курсор на определенный промежуток времени, он становится зеленым.

Это отлично работает на компьютере, но я бы хотел, чтобы он работал и на iPads. Я прочитал эту статью, но я начинаю, когда дело доходит до jQuery, поэтому я не понимаю, как реализовать это в моем коде:

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

<table>
<tr>
  <td class="c1">9.00 - 10.00</td>
  <td class="c2">10.00 - 11.00</td>
  <td class="c3">etc.</td>
</tr>
</table>


<script>
$( ".c1" ).hover(function() {
    $('.c1').css('background', 'LawnGreen ');
});
$( ".c2" ).hover(function() {
    $('.c2').css('background', 'LawnGreen ');
});
$( ".c3" ).hover(function() {
    $('.c3').css('background', 'LawnGreen ');
});
</script>

<style>
table {border-collapse:collapse;}
table, th, td {border: 1px solid black; padding: 10px;}
</style>

Какой код я должен добавить, чтобы сделать эту работу на iPads?

РЕДАКТИРОВАТЬ:

Я сейчас тестирую решение, предложенное Кирганом. Я попробовал очень базовую реализацию, чтобы увидеть, могу ли я заставить плагин работать:

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="jquery.hammer.js"></script>

<script>
    var element = document.getElementById('test_el');
    var hammertime = Hammer(element).on("tap", function(event) {
        alert('hello!');
    });
</script>

<p id="test_el">Tap here</p>

<style>
#test_el {font-size: 100px; border: solid red;}
</style>

Этот код находится в прямом эфире http://test.plantage82.nl

Если я открою это на iPhone и коснуюсь текста "Нажмите здесь", я должен получить предупреждение, не так ли? Этого не случилось, я сделал ошибку?