выбор и выделение дня в календаре с помощью jquery

Question

У меня есть следующая разметка:

<div class="calendar">
    <div class="heading">
        <a class="previous-month" href="javascript:;"></a>
        <h1 class="hmc">February&nbsp;2012</h1>
        <a class="next-month" href="javascript:;"></a>
    </div>

    <ul class="week hmc">
        <li>Su</li>
        <li>Mo</li>
        <li>Tu</li>
        <li>We</li>
        <li>Th</li>
        <li>Fr</li>
        <li>Sa</li>
    </ul>

    <ul class="january days hmc current">
        <li>&nbsp;</li>
        <li>&nbsp;</li>
        <li>&nbsp;</li>
        <li><a href="javascript:;">1</a></li>
        <li><a href="javascript:;">2</a></li>
        <li><a href="javascript:;">3</a></li>
        <li><a href="javascript:;">4</a></li>
        <li><a href="javascript:;">5</a></li>
        <li><a href="javascript:;">6</a></li>
        <li><a href="javascript:;">7</a></li>
        <li><a href="javascript:;">8</a></li>
        <li><a href="javascript:;">9</a></li>
        <li><a href="javascript:;">10</a></li>
        <li><a href="javascript:;">11</a></li>
        <li><a href="javascript:;">12</a></li>
        <li><a href="javascript:;">13</a></li>
        <li><a href="javascript:;">14</a></li>
        <li><a href="javascript:;">15</a></li>
        <li><a href="javascript:;">16</a></li>
        <li><a href="javascript:;">17</a></li>
        <li><a href="javascript:;">18</a></li>
        <li><a href="javascript:;">19</a></li>
        <li><a href="javascript:;">20</a></li>
        <li><a href="javascript:;">21</a></li>
        <li><a href="javascript:;">22</a></li>
        <li><a href="javascript:;">23</a></li>
        <li><a href="javascript:;">24</a></li>
        <li><a href="javascript:;">25</a></li>
        <li><a href="javascript:;">26</a></li>
        <li><a href="javascript:;">27</a></li>
        <li><a class="alt current" href="javascript:;">28</a></li>
        <li><a href="javascript:;">29</a></li>
        <li>&nbsp;</li>
        <li>&nbsp;</li>
        <li>&nbsp;</li>
    </ul>
</div>

Здесь я создаю календарь. Я хочу выделить текущий день, на который я нажимаю. Я пробовал:

$('body').on('click', '.january > li > a', function() {             
    $(this).closest('.january').children('li').each(function() {
        var anchor = $(this).children('a');
        anchor.addClass('alt current');
    )}
)}

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

Answer 1

Обход, который вы делаете с each(), closest() и children(), не обязателен, попробуйте это:

$('body').on('click', '.january > li > a', function() {
    $(".january > li > a").removeClass("alt current");            
    $(this).addClass('alt current');
});

Answer 2

Я думаю, что у вас есть проблема с событием связывания со ссылками.

Я использую этот сценарий:

$(document).ready(function(){
    $(".january li a").click(function(){
        $(this).addClass('alt current');
    });
});

Этот сценарий связывает событие щелчка для addClass.

Answer 3

$('body').on('click', '.january > li > a', function() {

         $(this).closest('.january').children('li').each(function() {
             var anchor = $(this).children('a');
             anchor.addClass('alt current');
         });
});

Порядок} и) не был правильным порядком.