Javascript - изменение глобальной переменной внутри функции

Question

У меня возникла проблема с изменением глобальной переменной внутри функции. Насколько я понимаю, не только должно быть то, что я установил внутри функции, но он также должен сохранить это значение в глобальной области, но это не так.

Рассмотрим код ниже:

<script type="text/javascript"> 
    var direction; 
    $(document).ready(function() { 
    $('#players_previous a').on('click', function() {direction = 'prev'; console.log(direction);}); 
    $('#players_next a').on('click', function() {direction = 'next'; console.log(direction);}); 
    }); 
</script> 

При нажатии кнопок, console.log(); возвращает undefined. Если я попытаюсь получить доступ к direction из консоли разработчика Chrome, он возвращает undefined. Что я делаю не так?

Answer 1

Кажется, что все работает нормально. Проблема была в другом месте моего кода. JSFiddle

HTML:

<ul> 
    <li id="players_previous"><a href="#">Previous</a></li> 
    <li id="players_next"><a href="#">Next</a></li> 
</ul> 

JS:

var direction; 
$(document).ready(function() { 
    $('#players_previous a').on('click', function() { 
    direction = 'prev'; 
    alert(direction); 
    }); 
    $('#players_next a').on('click', function() { 
    direction = 'next'; 
    alert(direction); 
    }); 
});