Javascript 动态折叠/展开可折叠文件

我创建了一个jQuery Monile可折叠文件的小列表。结构如下：

<div data-role="collapsibleset" data-theme="a" data-content-theme="a">

   <div data-role="collapsible"> 
      Text content
   </div 

  <div data-role="collapsible">
     Text content
   </div >

</div >

文本内容
CollapsableSet小部件一次只允许一个打开的可折叠文件。如果希望可折叠集的外观没有行为，请删除
data role=“collapsableset”
，而是添加
class=“ui collapsableset”
：

更新

您可能会发现这篇文章很有趣：因为它包括“全部展开”和“全部折叠”，以及在搜索框中键入内容时使用“可筛选”小部件打开匹配的可折叠文件。
您使用的JQM版本？
。可折叠（“折叠/扩展”）
较短；）@奥马尔，为了你，我的朋友$（“#theSet[data role=“collapsable”]”）。可折叠（this.id==“btnCollapse”？“collapse”：“expand”）；非常感谢ezanker！
<div id="theSet" class="ui-collapsible-set" >
   <div data-role="collapsible" > 
       <h3>Title 1</h3>
      Text content 1
   </div> 
   <div data-role="collapsible" >
      <h3>Title 2</h3>
     Text content 2
   </div>
   <div data-role="collapsible" >
      <h3>Title 3</h3>
     Text content 3
   </div >        
</div >

<div class="ui-grid-a">
  <div class="ui-block-a"><a id="btnExpand" class="ui-btn ui-corner-all collapseExpand">Expand All</a>
  </div>
  <div class="ui-block-b"><a id="btnCollapse" class="ui-btn ui-corner-all collapseExpand">Collapse All</a>
  </div>
</div>

$(document).on("click", ".collapseExpand", function(){
    var collapseAll = this.id == "btnCollapse";
    $('#theSet [data-role="collapsible"]').collapsible("option", "collapsed", collapseAll);
});