Невозможно выбрать топ значок в вертикальном стеке, используя начальную загрузку ⇐ Jquery

[Гость]

Я пытаюсь создать выбираемые значки, чтобы инициировать сортировку столбца даты. Я использую Bootstrap 5 и Font Awesome значки. Визуально все в порядке. < /P>

Код: Выделить всё

.sort-wrapper {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}

.sort-wrapper i.fa{
line-height: 0;
margin: 0 auto;
}

.clickable {
cursor: pointer;
transition: transform 0.2s;
}

.clickable:hover {
transform: scale(1.1);
}


Release Date

[i][/i]
[i][/i]

дает мне
< /p>
Что я и намеревался. Однако, когда я добавляю какой -то jQuery, чтобы запустить на основе выбора ... < /p>
$('#ascending').click(function() {
console.log("ascending");
});

$('#descending').click(function() {
console.log("descending");
});
< /code>
Я испытываю, что значок «восходящего» никогда не выбирается. Когда я нажимаю на него, я всегда получаю сообщение «нисходящего». Я также заметил странное поведение, когда попытался добавить подсказки на значки. Значок «нисходящий» будет вести себя должным образом, но не «восходящий» значок.>

Подробнее здесь: https://stackoverflow.com/questions/794 ... -bootstrap