{{#each rootList}}
  <div class="component {{componentClass}}" id="online-ranges">
    <h3 class="heading2">{{title}}
      {{#if viewLink}}
        <a href="#range" class="link-secondary view-link" id="view-btn">View all</a>
      {{/if}}
    </h3>
    <button class="btn btn_full {{dpdToggler}}">
      <span class="btn__text">
        {{btnText}}
        <span class="icon">
          <i class="far fa-chevron-down"></i>
        </span>
      </span>
    </button>
    <div class="{{mod}}">
      {{#each innerList}}
        <div class="{{mod}}-el-wrap" data-value="{{rangeId}}">
          <a href="{{link}}" class="{{mod}}-el" id="{{rangeId}}">
            {{innerTitle}}
            <span class="icon">
          <i class="fas fa-arrow-down"></i>
        </span>
          </a>
        </div>
      {{/each}}
    </div>
  </div>
{{/each}}