Как присвоить нужный class тегу body С помощью JS?

Question

[именно самое]

В общем есть CSS стиль

*{border:0px solid #eee;margin:0;padding:0;list-style:none}

body.main {
   -webkit-background-size: cover;
   -moz-background-size: cover;
   -o-background-size: cover;
    background-size: cover;
    background-attachment: scroll; /* Не трогать эту строку она обеспечивает перемещение фона!! */
    background-position: 100% 50%;
    margin:0;
    
    transition-timing-function: linear;
    -moz-transition-timing-function: linear;
    -o-transition-timing-function: linear;
    -webkit-transition-timing-function: linear;
        
  -moz-transition: all 1s ease-in-out;
  -webkit-transition: all 1s ease-in-out;
  -o-transition: all 1s ease-in-out;
   transition: all 1s ease-in-out;
  
   }

 .bg1 { background: 
    url(foto/1.jpeg) no-repeat;}
    
  .bg2 { background: 
    url(foto/2.jpeg) no-repeat;}
    
    .bg3 { background: 
    url(foto/3.jpeg) no-repeat;}

Не могу понять ка сделать так чтобы через DOM, можно было обратиться тегу body
И поменять class с ( .bg1 - .bg3;);

var body = document.getElementsByTagName("body");
var changeCl = body.getElementsByClassName("bg1");

НО тут где-то ошибка потому что ничего не происходит? Подскажите знающие люди.

Answer 1

[Mikhail Osher]

Вроде как-то так:

document.querySelector('body').classList.add('className');

Comments

[именно самое]

А что за справочник ты почитываешь???

[Mikhail Osher]

именно самое: советую почитать javascript.ru и mozilla developer network.

[именно самое]

спасибо за ответы, https://learn.javascript.ru/ и javascript.ru это натольные книги. а вот mozilla developer network.
еще не видел

Answer 2

[Денис Инешин]

// пропустили [0] в конце, так как getElements возвращает коллекцию
var body = document.getElementsByTagName("body")[0];

А дальше воспользуйтесь classList

Answer 3

[именно самое]

И продолжая задавать вопрос честным людям : - Какой справочник они читают?
Кто нибудь сможет объяснить что тут не то с функцией??

var i=1;
var body = document.querySelector('body')
body.classList.add('bg'+i);

function cbg ()
{ if (i!=1)
    {body.classList.add('bg'+(i++));}
};
 
setTimeout(cbg,2000);