Bootstrap 5 icons, не обновляется иконка при замене класса через js, как исправить эту проблему?

Question

[Alex Alc]

мы имеем простенькую иконку bootstrap добавленную динамически вместе с родительским элементом.

<i class="test bi bi-person-fill-add someAnotherClass"></i>

при определённом действии заменяем существующий класс на класс другой иконки через jquery

$('.test').removeClass('bi-person-fill-add').addClass('bi-person-fill-dash');

как итог, класс при инспекции кода изменился, но иконка осталась прежней, как можно решить данную проблему кроме как удалить и создать элемент заного?

Comments

[Владимир Римидалв]

А если задать изначально bi-person-fill-dash то иконка правильная отображается? Я к тому, что у тебя точно этот класс не является алиасом?

А еще мб это поведение из-за someAnotherClass? Может порядок имеет значение?

Еще как вариант можно попробавть не удаление-добавление класса, а https://api.jquery.com/toggleClass/

На крайний случай можно вот так тригернуть $('.test')[0].offsetHeight; но это совсем наркоманство

[Alex Alc]

Владимир Римидалв, Спасибо за развёрнутый ответ, как ни странно проснувшись взялся за проект и всё работает отлично, без каких либо изменений кода.

Answer 1

[Сергей delphinpro]

Нормально всё работает

Comments

[Alex Alc]

Мистика, проснувшись и заново взявшись за проект без изменений кода проверил, всё действительно заработало. В любом случае спасибо.

[lil_koi]

Alex Alc, магия кеша. Открой devtools -> networks и выключи кеш