Как правильно добавить дополнительный класс в javaScript?

Question

[RushV]

Здравствуйте!
Есть код

/* get frame block */
var commentBlock = document.getElementById("recentcomments");
/* link contains in tag 'p', find it all */
var pTags = commentBlock.getElementsByTagName("p");
/* if tag have class 'dsq-widget-meta' - delete it */
for (i=0; i < pTags.length; i++)
  if(pTags[i].className === "dsq-widget-meta")
    pTags[i].parentNode.removeChild(pTags[i]);

var elementsLi = $(".dsq-widget-item");
for(var d = 0; d < elementsLi.length; d++){
	elementsLi.addClass("col-md-4");
}
var commentsPageURL = "http://penzaurist.ru/%d0%be%d1%82%d0%b7%d1%8b%d0%b2%d1%8b/";
/* get each comment */
var comments = commentBlock.getElementsByTagName("li");
/* get first and second link in comments and change it */
for (i=0; i < comments.length; i++){
  /* get links */
  var avatarLink = comments[i].getElementsByTagName("a")[0];
  var nameLink = comments[i].getElementsByTagName("a")[1];
  /* change */
  avatarLink.setAttribute("href", commentsPageURL);
  nameLink.setAttribute("href", commentsPageURL);
}

Я попытался добавить сласс к классу "dsq-widget-item"

var elementsLi = $(".dsq-widget-item");
for(var d = 0; d < elementsLi.length; d++){
	elementsLi.addClass("col-md-4");
}
Но нечего не работает где у меня ошибка?

Вот структура в хтмл

<ul class="dsq-widget-list">
      <li class="dsq-widget-item">
      <li class="dsq-widget-item">
      <li class="dsq-widget-item">
</ul>

Answer 1

[Сергей]

.addClass - это один из методов библиотеки JQuery, которая у тебя, видимо, не подключена. На чистом javascript класс добавляется немного иначе: .classList.add("myClass").

Comments

[RushV]

Ну так то я правильно сделал или что то лишнее добавил в код?

[RushV]

Как правильно написать этот код на javaScript ?

var elementsLi = $(".dsq-widget-item");
for(var d = 0; d < elementsLi.length; d++){
  elementsLi.addClass("col-md-4");
}

[Сергей]

Вот так:

var elementsLi = document.querySelectorAll(".dsq-widget-item");
for (var d = 0; d < elementsLi.length; d++) {
  elementsLi[d].classList.add("col-md-4");
}

[Jumandjilos]

Сергей, ты кое-что не учёл. Если на чистом JS, то никаких $ там быть не может. Элементы отбираются через document.querySelector

[Сергей]

Jumandjilos, да, не заметил, поправил код.

[RushV]

Что то не работает(
может это важно я хотел переделать код вывода комментариев Disqus может переделать такой код нельзя

[RushV]

Подключил jqvery
написал вот так и всё заработало как надо

var elementsLi = $(".dsq-widget-item");
for(var d = 0; d < elementsLi.length; d++){
  elementsLi.addClass('col-md-4');
}

[Павел Корнилов]

RushV,

написал вот так и всё заработало как надо

Ерунда. Что это за код? Зачем там цикл?

[Павел Корнилов]

var elementsLi = document.querySelectorAll(".dsq-widget-item");
for(var d = 0; d < elementsLi.length; d++){
  d.classList.add("col-md-4");
}

[RushV]

KorniloFF, А как правильно написать?

[Павел Корнилов]

На нативе - см. выше.
На квери:

var elementsLi = $(".dsq-widget-item");
elementsLi.addClass('col-md-4');

[Павел Корнилов]

Или даже так:
$(".dsq-widget-item").addClass('col-md-4');

[RushV]

Да всё верно написал именно так спасибо)
$(".dsq-widget-item").addClass('col-md-4');