I'm not crazy about this solution but what I've done is created a unique name attribute for each list element, then on the expand event I set a variable equal to the unique name attribute of the expanded element. Then I use condition logic in the collapse handler so code only fires if the name of the collapsing element is equal to that of the previously expanded element.
It's not pretty but it seems to work.
$(document).ready(function () {
//Create element name variable
var elementName;
for (var i = 0; i < 4; i++) {
(function (i) {
var element = $("#listElementTemplate").clone();
//Use index to create unique name attribute
element.attr("name",count);
element.find('h3').append("list Element: " + i);
$("#list").append(element);
element.on('expand', function () {
//On expand set element name to name of expanded element
elementName = $(this).attr("name");
});
element.collapsible();
element.on('collapse', function(){
//Use conditional logic only trigger code on the previously expanded element
if (elementName == $(this).attr("name")){
//code to execute
}else{
//Leave empty
}
});
}
});