JQuery: код добавляет слишком много HTML в dom

Я работаю над функцией, в которой пользователи могут фильтровать список событий (шоу в театре и т. д.) По месяцу, месту и названию.

Поскольку они могут выбрать более одного фильтра, под раскрывающимися меню отображается список, содержащий выбор пользователей.

Моя проблема в том, что независимо от того, какой элемент нажат, он добавляется во все три списка. Если опция не отмечена, она удаляется только из первого списка (который содержит месяцы).

См. Код jQuery:

        var options = [];

        var currentSelectionMonths = [];
        var currentSelectionLocations = [];
        var currentSelectionEvents = [];

        $('.dropdown-menu a').on('click', function (event)
        {
            var $target = $(event.currentTarget),
                val = $target.attr('data-value'),
                $inp = $target.find('input'),
                idx;

            if ((idx = options.indexOf(val)) > -1)
            {
                options.splice(idx, 1);
                setTimeout(function () { $inp.prop('checked', false) }, 0);

                if (options.length === 0)
                {
                    $('.currentselection').hide();
                }

                if ($(this).parent('#months'))
                {
                    currentSelectionMonths.splice(idx, 1);  
                    $('.timelist').html(currentSelectionMonths);
                }

                if ($(this).parent('#locations'))
                {
                    currentSelectionMonths.splice(idx, 1);
                    $('.locationlist').html(currentSelectionLocations);
                }

                if ($(this).parent('#events'))
                {
                    currentSelectionMonths.splice(idx, 1);
                    $('.eventlist').html(currentSelectionEvents);
                }
            }
            else
            {
                options.push(val);
                setTimeout(function () { $inp.prop('checked', true) }, 0);

                $('.currentselection').show();

                if ($(this).parent('#months'))
                {
                    currentSelectionMonths.push($(this).attr('data-value') + ' ');
                    $('.timelist').html(currentSelectionMonths);
                }

                if ($(this).parent('#locations'))
                {
                    currentSelectionLocations.push($(this).attr('data-value') + ' ');
                    $('.locationlist').html(currentSelectionLocations);
                }

                if ($(this).parent('#events'))
                {
                    currentSelectionEvents.push($(this).attr('data-value') + ' ');
                    $('.eventlist').html(currentSelectionEvents);
                }
            }

            $(event.target).blur();

            console.info(options);
            return false;
        });

И соответствующий html:

<div class = "container-fluid">
    <div class = "row">
        <div class = "col-lg-6" style = "background-color: greenyellow;">
            <div class = "dropdowns" style = "display: inline;">
                <div class = "dropdown" style = "display: inline;">
                    <button class = "btn btn-primary dropdown-toggle" type = "button" data-toggle = "dropdown">
                        Zeitraum
                        <span class = "caret"></span>
                    </button>
                    <ul class = "dropdown-menu" id = "months">
                        @foreach (var month in Model.MonthsList)
                        {
                            <li><a href = "#" data-value = "@month" tabIndex = "-1"><input type = "checkbox" class = "timeboxes" />&nbsp;@month</a></li>
                        }
                    </ul>
                </div>
                <div class = "dropdown" style = "display: inline;">
                    <button class = "btn btn-primary dropdown-toggle" type = "button" data-toggle = "dropdown">
                        Spielstätte
                        <span class = "caret"></span>
                    </button>
                    <ul class = "dropdown-menu" id = "locations">
                        @foreach (var location in Model.LocationList)
                        {
                            <li><a href = "#" data-value = "@location" tabIndex = "-1"><input type = "checkbox" class = "locationboxes" />&nbsp;@location</a></li>
                        }
                    </ul>
                </div>
                <div class = "dropdown" style = "display: inline;">
                    <button class = "btn btn-primary dropdown-toggle" type = "button" data-toggle = "dropdown">
                        Produktion
                        <span class = "caret"></span>
                    </button>
                    <ul class = "dropdown-menu" id = "events">
                        @foreach (var evnt in Model.EventsList)
                        {
                            <li><a href = "#" data-value = "@evnt" tabIndex = "-1"><input type = "checkbox" class = "eventboxes" />&nbsp;@evnt</a></li>
                        }
                    </ul>
                </div>
            </div>
        </div>
    </div>
    <br />
    <div class = "container-fluid currentselection" style = "display: none;">
        <div class = "headline">
            <h3>Aktuelle Auswahl:</h3>
        </div>
        <div class = "row">
            <div class = "col-lg-1">
                <p>Zeitraum: </p>
            </div>
            <div class = "col-lg-10">
                <span class = "timelist"></span>
            </div>
        </div>
        <div class = "row">
            <div class = "col-lg-1">
                <p>Spielstätte: </p>
            </div>
            <div class = "col-lg-10">
                <span class = "locationlist"></span>
            </div>
        </div>
        <div class = "row">
            <div class = "col-lg-1">
                <p>Produktion: </p>
            </div>
            <div class = "col-lg-10">
                <span class = "eventlist"></span>
            </div>
        </div>
    </div>
</div>

Я попытался вложить операторы if с операторами else: без изменений. Я попытался выбрать li-elements вместо: no change. Я пробовала искать детей вместо родителей: без изменений.

Ясно, что я чего-то не вижу, пожалуйста, помогите :)

Редактировать: Не беспокойтесь о желто-зеленом фоне, он предназначен только для тестирования: D

Edit2: Как я выяснил (и schellmax тоже), parent(...) нужно заменить на parents(...). Причина, по которой удаление элементов не сработало, заключалась в том, что программисты ослепли, потратив слишком много времени на поиск решения: Пробовал удалить только из одного списка, трижды currentSelectionMonths.splice(idx, 1);