Как изменить класс элемента с помощью javascript?

Question

[Алексей Гончаров]

У <li> есть класс: class="havesubchild sub mpIt mpId2". Его нужно изменить наclass="mpIt mpId21". Как это сделать с помощью javascript?

Comments

[Алексей Гончаров]

Знает кто нибудь как это сделать?

[Stranger in the Q]

конечно кто-то знает, но зачем Вам это, Вы же не хотите это знать

[Алексей Гончаров]

Stranger in the Q, я хочу знать, можешь пожалуйста сказать

[scottparker]

asd1982, нет ты не хочешь знать. ты хочешь

напишите только готовый код javascript

Answer 1

[Dmitriy Grape]

document.querySelectorAll('.havesubchild').forEach((el) => {
  el.classList.remove('havesubchild')
})

document.querySelectorAll('.havesubchild').forEach((el) => {
  el.classList.add("mpIt", "mpId21")
})

Comments

[Dmitriy Grape]

человек выше сделал всё правильно, я дополнил его код.

[Алексей Гончаров]

Fatal error: Smarty error: [in ./inc/arch7/index.tpl line 530]: syntax error: unrecognized tag: el.classList.remove('havesubchild') (Smarty_Compiler.class.php, line 446) in /home/user3124/grazvalda.websolutions.pp.ua/inc/frontend/smarty/libs/Smarty.class.php on line 1093

Новая ошибка)

[Dmitriy Grape]

Это уже проблема не моего кода, а того, куда вы его засунули

[Rustam Bainazarov]

asd1982, откройте документацию Smarty. Посмотрите, как там вставлять JS-код в шаблонах.

Answer 2

[Corvuss]

Если один тег:

document.querySelector('.havesubchild').classList.remove('havesubchild', 'sub')

Если много:

document.querySelectorAll('.havesubchild').forEach((el) => {
  el.classList.remove('havesubchild', 'sub')
})

Comments

[Алексей Гончаров]

не удаляется

[Corvuss]

asd1982, вот https://jsfiddle.net/4e86zdos/2/
Всё работает.

[Алексей Гончаров]

Corvuss, мне нужно на mpid 21 а не на mpid 2

Answer 3

[Икотий Айтишевич]

С учётом Ваших познаний, воспользуйтесь JQuery. Вот ссылка, там код, просто приложите минимальные усилия и подставьте свои значения: https://api.jquery.com/toggleClass/#toggleClass-cl.... И не забудьте подключить к Вашему сайту библиотеку JQuery.

Answer 4

[UthvfyV]

<li class="havesubchild sub mpIt mpId2">Как изменить класс элемента с помощью javascript?</li>
<script>var element = document.querySelector('.havesubchild');
element.className = 'mpIt mpId21';</script>