单击时加载选项卡内容

Question

我试图从其他来源获取点点滴滴，但我无法获得所需的效果。我有多个当前预加载的选项卡，他们加载的内容是特定的是一些RSS提要，因为我已经添加了更多选项卡，页面逐渐加载了更长的时间来加载，自然..我在这里我需要在点击/触发器上加载标签内容。实现这一目标的最佳方法是什么？

HTML

     <div class="header">
    <h4 class="title">Header</h4>
    <p class="category">Some tagline here</p>
  </div>
  <div class="content content-full-width">
    <ul role="tablist" class="nav nav-tabs">
      <li role="presentation" class="active">
        <a href="#us" data-toggle="tab" aria-expanded="true">USA</a>
      </li>
      <li class="">
        <a href="#uk" data-toggle="tab" aria-expanded="false">UK</a>
      </li>
      <li class="">
        <a href="#au" data-toggle="tab" aria-expanded="false">AU</a>
      </li>
      <li class="">
        <a href="#ca" data-toggle="tab" aria-expanded="false">CA</a>
      </li>
      <li class="">
        <a href="#nz" data-toggle="tab" aria-expanded="false">NZ</a>
      </li>
    </ul>
    <div class="tab-content">
      </br>
      <div id="us" class="tab-pane active">
        - Content Here -
      </div>
      <div id="uk" class="tab-pane">
        - Content Here -
      </div>
      <div id="au" class="tab-pane">
        - Content Here -
      </div>
      <div id="ca" class="tab-pane">
        - Content Here -
      </div>
      <div id="nz" class="tab-pane">
        - Content Here -
      </div>
    </div>
  </div>

的jsfiddle

https://jsfiddle.net/qvussf6t/1/

感谢。