The following is for an accordion where only one panel will be open at a time (for Bootstrap 3)
1. CSS - only
#accordion2 .accordion-toggle span.glyphicon.glyphicon-collapse-up:before {
content:"\e160" /* an up type icon */
}
#accordion2 .accordion-toggle.collapsed span.glyphicon.glyphicon-collapse-up:before {
content:"\e159" /* a down type icon */
}
The collapsed class needs to be set in the HTML from the outset
JS fiddle example
2. Javascript
Using Javascript to check for the class '.collapsed' on all the links with class '.accordion-toggle':
jQuery(document).ready(function ($) {
$(document).on('click', '.accordion-toggle', function () {
$(".accordion-toggle").each(function () {
var iconSpan = $(this).find('.glyphicon');
if ($(this).hasClass('collapsed')) {
$(iconSpan).removeClass('glyphicon-chevron-up').addClass('glyphicon-chevron-down');
} else {
$(iconSpan).removeClass('glyphicon-chevron-down').addClass('glyphicon-chevron-up');
}
});
});
});
Fiddle: http://jsfiddle.net/JungleEditor/bCk3f/