I have this code for a collapsible header text and a caret besides it which collapses/uncollapses a div .

<span><strong>"Weekly"</strong></span> <a class="caret" type="button" data-toggle="collapse" data-target="#weekly" aria-expanded="false" aria-controls="weekly"></a>

<div class="collapse overflow-hidden" id="weekly">
  # Collapsible content
</div>

I want to make the header text next to the caret clickable too, to give the user a larger area to click on that will collapse/uncollapse the corresponding div.

I've tried wrapping the span and a tags inside a link_to with unsatisfying results (the text links to the anchor that represents the id of the div to be uncollapsed).

What would be the correct way to accomplish this?