diff --git a/dist/collection/components/accordion-container/accordion-container.js b/dist/collection/components/accordion-container/accordion-container.js
index c9f08b447b00244ff296d58e0da4ec31b421d76a..6895cb9436775e62e6c5e9f39b4f5deac488f4b2 100644
--- a/dist/collection/components/accordion-container/accordion-container.js
+++ b/dist/collection/components/accordion-container/accordion-container.js
@@ -3,7 +3,7 @@ export class AccordionContainer {
     render() {
         const classAttributes = ["hy-accordion-container", "js-hy-accordion"];
         const id = this.accordionid.toLowerCase().replace(/\W/g, '-');
-        return (h("div", { id: id, class: classAttributes.join(" "), "data-allow-multiple": "true" },
+        return (h("div", { id: id, class: classAttributes.join(" "), "data-allow-multiple": "true", "data-allow-toggle": "true" },
             h("slot", null)));
     }
     static get is() { return "hy-accordion-container"; }
diff --git a/dist/collection/components/accordion-item/accordion-item.js b/dist/collection/components/accordion-item/accordion-item.js
index ae7ac717065b652b6137d40e1deaf1b4c243733a..4a021b5ed8ff9b4c1bc33388f6c194b95057b880 100644
--- a/dist/collection/components/accordion-item/accordion-item.js
+++ b/dist/collection/components/accordion-item/accordion-item.js
@@ -57,6 +57,7 @@ export class AccordionItem {
                             accordion.querySelector(`#${target.getAttribute('aria-controls')}`).setAttribute('aria-hidden', 'true');
                         }
                         event.preventDefault();
+                        event.stopImmediatePropagation();
                     }
                 });
                 if (accordion) {
diff --git a/src/components/accordion-container/accordion-container.tsx b/src/components/accordion-container/accordion-container.tsx
index ced0a2e557655da53ad533c412b120251e298434..18b262bd249f86ec3fb84324bad1da866a9bd70e 100644
--- a/src/components/accordion-container/accordion-container.tsx
+++ b/src/components/accordion-container/accordion-container.tsx
@@ -12,7 +12,7 @@ export class AccordionContainer {
     const classAttributes = ["hy-accordion-container", "js-hy-accordion"];
     const id = this.accordionid.toLowerCase().replace(/\W/g,'-');
     return (
-      <div id={id} class={classAttributes.join(" ")} data-allow-multiple="true">
+      <div id={id} class={classAttributes.join(" ")} data-allow-multiple="true" data-allow-toggle="true">
         <slot></slot>
       </div>
     );
diff --git a/src/components/accordion-item/accordion-item.tsx b/src/components/accordion-item/accordion-item.tsx
index 8fbb57eac327fb48b7115d7524fe58a81c8b946c..6408ff4b94ac528740128e5834bc5ab4cb96ee15 100644
--- a/src/components/accordion-item/accordion-item.tsx
+++ b/src/components/accordion-item/accordion-item.tsx
@@ -28,7 +28,6 @@ export class AccordionItem {
 
     if (this.ready && containerId.length > 0) {
       document.querySelectorAll(`#${containerId}`).forEach(function (accordion) {
-
         const allowMultiple = accordion.hasAttribute('data-allow-multiple');
         const allowToggle = (allowMultiple) ? allowMultiple : accordion.hasAttribute('data-allow-toggle');
         
@@ -36,7 +35,7 @@ export class AccordionItem {
 
         accordion.addEventListener('click', function (event) {
           let target = event.target as HTMLTextAreaElement;
-      
+
           if (target && target.classList.contains('hy-accordion__button')) {
             let targetParent = target.closest('.hy-accordion__item');
             let targetContent = targetParent.querySelectorAll('.hy-accordion__content')[0];
@@ -77,6 +76,7 @@ export class AccordionItem {
             }
       
             event.preventDefault();
+            event.stopImmediatePropagation();
           }
         });
       
diff --git a/src/index.html b/src/index.html
index 1f92f1de9a1c07863c136e10134089ad1e0d4845..13f055deafae2bc14f909acd53160191c2b48011 100644
--- a/src/index.html
+++ b/src/index.html
@@ -305,6 +305,13 @@
             </hy-grid-item>
           </hy-grid-row>
         </hy-grid-item>
+      <hy-grid-item columns="12">
+        <hy-accordion-container accordionid="example-2">
+          <hy-accordion-item accordiontitle="This is accordion item 1">
+            Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+          </hy-accordion-item>
+        </hy-accordion-container>
+      </hy-grid-item>
       </hy-grid-row>
   </hy-grid-container>
   </body>
diff --git a/www/index.html b/www/index.html
index 285f166e2bd0390a204c7b8967802c100654e6b1..eece513c7f24f074dd4ad6e75f09dab7e604950c 100644
--- a/www/index.html
+++ b/www/index.html
@@ -40,4 +40,4 @@
                 elit.</hy-tiny-text> </hy-grid-item> <hy-grid-item columns="4" columnssm="12" columnslg="3" contentalign="right"> <hy-tiny-text>Lorem ipsum dolor sit amet, consectetur adipiscing
                 elit.</hy-tiny-text> </hy-grid-item> <hy-grid-item columns="4" columnssm="12" columnslg="3" contentalign="left"> <hy-tiny-text>Lorem ipsum dolor sit amet, consectetur adipiscing
                 elit.</hy-tiny-text> </hy-grid-item> <hy-grid-item columns="4" columnssm="12" columnslg="3" contentalign="center"> <hy-tiny-text>Lorem ipsum dolor sit amet, consectetur adipiscing
-                elit.</hy-tiny-text> </hy-grid-item> </hy-grid-row> </hy-grid-item> </hy-grid-row> </hy-grid-container> </body></html>
\ No newline at end of file
+                elit.</hy-tiny-text> </hy-grid-item> </hy-grid-row> </hy-grid-item> <hy-grid-item columns="12"> <hy-accordion-container accordionid="example-2"> <hy-accordion-item accordiontitle="This is accordion item 1"> Lorem ipsum dolor sit amet, consectetur adipiscing elit. </hy-accordion-item> </hy-accordion-container> </hy-grid-item> </hy-grid-row> </hy-grid-container> </body></html>
\ No newline at end of file