Укладка всех элементов массива с помощью петли

Question

У меня есть div с красной рамкой. Я бы хотел, чтобы эта граница исчезла после того, как скажем 3 секунды, когда страница будет загружена. В этом div есть 3 изображения, и я хотел бы, чтобы они были непрозрачными 0,1 после того же времени. Я попытался сделать это с помощью таймера, но он не будет работать. Мне удалось заставить пограничную часть работать, но когда я пытаюсь сделать изображения, они не запускаются, и Аптана говорит там ошибку, где цикл for.

function setPlaylist(){ 
    var playlist = document.getElementById('playlist'); 
    var thumbnails = document.getElementsByClassName('thumb').getElementByTagName('img'); 

    for(var i=0,i<thumbnails.length;i++) 
    { 
     thumbnails[i].style.opacity = ('0.1'); 
    } 
    playlist.style.border = ('none'); 
    /*thumbnails.style.opacity = ('0.1');*/ 
} 

function timerPL(){ 
    setTimeout(setPlaylist,3000); 
} 


window.addEventListener('load',timerPL,false); 

Answer 1

Эта функция:

document.getElementsByClassName('thumb').getElementByTagName('img'); 
//    ^
//     \_ It's plural. It'll return an array of elements 

Вам нужно перебирать их:

var thumbs = document.getElementsByClassName('thumb'); 

for (var i = 0; i < thumbs.length; i++) { 
    var thumb = thumbs[i]; 

    ... 
} 

Если вы не заботитесь о старых браузерах, используйте querySelectorAll:

var thumbs = document.querySelectorAll('#playlist .thumb img');