Добавить стиль CSS, используя javascript

Question

Я создавал расширение хром, в котором некоторые значки отображаются на пустой вкладке. Я использую javascript для добавления значков на страницу. Ниже приведены фрагменты кода:

HTML:

<div id="icons" class="icons"></div> 

Javascript:

function addIcons() { 
    for (var i = 0; i < iconArray.length; i++) { 
    var link = document.createElement('a'); 
    link.href = linkArray[i]; 

    var icon = document.createElement('img'); 
    icon.src = "images/" + iconArray[i]; 
    icon.title = titleArray[i]; 

    link.appendChild(icon); 
    document.getElementById('icons').appendChild(link); 
    } 
    document.getElementById('icons').style.borderBottom="2px solid blue"; 
} 

Проблема заключается в том, что граница появляется над иконками (граница должна появиться ниже!). Может ли кто-нибудь сказать мне, что нужно сделать, чтобы получить желаемый результат?

Answer 1

Просто попробовал свой код, и он работает правильно.

Снимок экрана: https://skitch.com/runk/83fes, последний Chrome.

У вас есть действующая разметка html на остальной части страницы? Может быть, проблема с этим.

И я бы предложил не устанавливать стиль css через js.

<div id="icons" class="icons" style="border-bottom: 2px solid blue"></div> 

Или с помощью стилей CSS тегов (файл)

<style> 
.icons { border-bottom: 2px solid blue } 
</style> 

Answer 2

Проверить http://reference.sitepoint.com/css/border-bottom для установки нижней границы для любого элемента DOM.