Twitter bootstrap 3.0 icon change on collapse

Question

This is about Bootstrap 3.0. I would like the icon/glyphicon to change on collapse. I.e, from a closed folder to an open one.

I have searched far and wide, and have read threads here on SO, but to no avail. This thread was close, and is basically what I want. How can I make it work in Bootstrap 3?

Answer 1

The collapse events are handled differently in Bootstrap 3. Now it would be something like:

$('#collapseDiv').on('shown.bs.collapse', function () {
   $(".glyphicon").removeClass("glyphicon-folder-close").addClass("glyphicon-folder-open");
});

$('#collapseDiv').on('hidden.bs.collapse', function () {
   $(".glyphicon").removeClass("glyphicon-folder-open").addClass("glyphicon-folder-close");
});

Demo: http://www.bootply.com/73101