Он отлично работает, если html уже присутствует, но когда я добавляю html динамически, он вообще не работает. Я попытался инициализировать его $ ('. Collapsible'). Collapsible (); и он иногда расширяется, но не всегда.
$(document).on('click', '.controls .add-step', function(e) {
var addto = $(this).next().find(".collapsible");
var newIn = '<li class=""> <div class = "collapsible-header" ><i class = "addaction material-icons ">add</i></div><div class = "collapsible-body"><p>This is text</p></div></li>';
var newInput = $(newIn);
$(addto).append(newInput);
$('.collapsible').collapsible();
});
https://jsfiddle.net/ykpLne4o/