我正在尝试创建一个手风琴使用使用下面的代码。 如果下面的标签放在一起，那么它的工作很好。 我想在页面其他部分的某个标记中插入元素

     <dt>
     <li class="nav-item"   id='l1' >
     <a class="nav-link active js-accordionTrigger"   href="#accordion1" aria-expanded="false" aria- 
     controls="accordion1">
     <i class="material-icons">camera</i>
      Studio
      </a>
      </li></dt>

        <dd class="accordion-content accordionItem is-collapsed" id="accordion1" aria-hidden="true">
            <p>Lorem ipsum doplacerat. Cras justo purus,enim sit amet varius. Pellentesque justo dui, 
          sodales quis luctus a, iaculis eget mauris.</p>
           </dd> 

如果我试着把标签放在这里。 它不工作，我可以看到错误setAttribute undefined

         <div class="tab-content tab-space">
        <div class="tab-pane active text-center gallery" >
         <dd class="accordion-content accordionItem is-collapsed" id="accordion1" aria-hidden="true">
            <p>Lorem iet mauris.</p>
           </dd> 
         </div>
        </div>
                        

下面是Javascript和Jquery代码

   <script>
   $(document).ready(function () {

  var d = document,
    $accordionToggles = $('.js-accordionTrigger'),
    touchSupported = ('ontouchstart' in window),
    pointerSupported = ('pointerdown' in window),

    skipClickDelay = function (e) {
        e.preventDefault();
        e.target.click();
    },

    setAriaAttr = function (el, ariaType, newProperty) {
        el[0].setAttribute(ariaType, newProperty);
    },

    setAccordionAria = function (el1, el2, expanded) {
        setAriaAttr(el1, 'aria-expanded', expanded ? true : false);
        setAriaAttr(el2, 'aria-expanded', expanded ? false : true);
    },

    switchAccordion = function (e) {
        e.preventDefault();

        var $this = $(this),
            $thisQuestion = $this,
            $thisAnswer = $this.closest('dt').next('dd'),
            // Check if the answer is in collapsed state
            isCollapsed = $thisAnswer.hasClass('is-collapsed');

        // Iterate over all the toggles and collaspse
        // them all and only toggle the current tab
        for (var i = 0; i < $accordionToggles.length; i++) {
            var $currQuestion = $accordionToggles.eq(i),
                $currAnswer = $currQuestion.closest('dt').next('dd');

            setAccordionAria($currQuestion, $currAnswer, false);

            $currQuestion.addClass('is-collapsed').removeClass('is-expanded');
            $currAnswer.addClass('is-collapsed').removeClass('is-expanded animateIn');
        }

        if (isCollapsed) {
            setAccordionAria($thisQuestion, $thisAnswer, true);

            $thisQuestion.addClass('is-expanded is-collapsed');
            $thisAnswer.addClass('is-expanded animateIn').removeClass('is-collapsed');
        }
    };

// Assign the click events using jQuery

if (touchSupported) {
    $accordionToggles.on('touchstart', skipClickDelay);
}
if (pointerSupported) {
    $accordionToggles.on('pointerdown', skipClickDelay);
}
$accordionToggles.on('click', switchAccordion);
    });

    </script>