Make sub-menu heading toggle the sub-menu, not just the button

Currently if there is a sub-menu in the menu, only the down arrow will open the sub-menu items. Here is the code:

<li id="menu-item-1300" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-has-children menu-item-1300" style="">
   <div class="ancestor-wrapper">
      <a href="#">Indexes and Glossary</a>
      <button class="toggle sub-menu-toggle fill-children-current-color active" data-toggle-target=".menu-modal .menu-item-1300 > .sub-menu" data-toggle-type="slidetoggle" data-toggle-duration="250" aria-expanded="true">
         <span class="screen-reader-text">Show sub menu</span>
         <svg class="svg-icon" aria-hidden="true" role="img" focusable="false" xmlns="https://www.w3.org/2000/svg" width="20" height="12" viewBox="0 0 20 12">
            <polygon fill="" fill-rule="evenodd" points="1319.899 365.778 1327.678 358 1329.799 360.121 1319.899 370.021 1310 360.121 1312.121 358" transform="translate(-1310 -358)"></polygon>
         </svg>
      </button>
   </div>

Users are asking why clicking on “Indexes and Glossary” doesn’t open the sub menu. It is, after all, styled as a link, so one would expect to be able to click on it and have something happen. To me this seems like such an obvious expected behaviour.

Is there any way to get the text “Indexes and Glossary” (in the above example) to open the dropdown sub menu? Or is this a shortcoming of WordPress core? I really don’t want to install a menu plugin just to get the menu to work as expected.

Thanks!!