e"&gt;Toggle panel&lt;/button&gt;

&lt;div id="demo-panel-collapse" class="toggle-panel" aria-hidden="true"&gt;
  ...
&lt;/div&gt;
</code></pre>


            <h2>Events</h2>

            <p>A toggle fires an event on each toggle state i.e. toggleOpening, toggleOpened, toggleClosing and toggleClosed. This can be observed on the element itself or the document.</p>

            <pre><code class="overflow-inline" tabindex="0">document.querySelector('.toggle').addEventListener('toggleOpening', (event) => { 
  c