title: foundation tab not working
body: <p>I use Foundation 5.3 with Jade and express.</p>
  
  <p>I created a tab component, pasted the code from Foundation Docs but it seems to be not working.</p>
  
  <p>I included what css and js which I supposed is enough, however, only the active one in tabs can <em>display</em>, for others, when I click the title of tab, it doesn't display. </p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
  &lt;head&gt;
      &lt;title&gt;Profile | Login System&lt;/title&gt;
      &lt;meta name="viewport" content="width=device-width, initial-scale=1.0"&gt;
      &lt;link href="/css/foundation.min.css" rel="stylesheet"&gt;
  &lt;/head&gt;
  
  &lt;body&gt;
      &lt;nav class="top-bar"&gt;
          &lt;ul class="title-area"&gt;
              &lt;li class="name"&gt;
                  &lt;h1&gt;&lt;a href="/"&gt;Homepage&lt;/a&gt;&lt;/h1&gt;
              &lt;/li&gt;
          &lt;/ul&gt;
          &lt;section class="top-bar-section"&gt;
              &lt;ul class="right"&gt;
                  &lt;li&gt;&lt;a href="/profile" class="button success"&gt;12&lt;/a&gt;&lt;/li&gt;
              &lt;/ul&gt;
          &lt;/section&gt;
      &lt;/nav&gt;
      &lt;div class="row"&gt;
          &lt;div class="large-8 large-centered columns"&gt;
              &lt;br&gt; &lt;br&gt;
              &lt;h1 class="text-center"&gt;Welcome to Login System!&lt;/h1&gt;
              &lt;h2 class="text-center"&gt;This is Profile Page&lt;/h2&gt;
              &lt;br&gt;
              &lt;hr&gt;
              &lt;br&gt;
              &lt;ul class="tabs" data-tab&gt;
                  &lt;li class="tab-title active"&gt;&lt;a href="#panel2-1"&gt;Tab 1&lt;/a&gt;&lt;/li&gt;
                  &lt;li class="tab-title"&gt;&lt;a href="#panel2-2"&gt;Tab 2&lt;/a&gt;&lt;/li&gt;
                  &lt;li class="tab-title"&gt;&lt;a href="#panel2-3"&gt;Tab 3&lt;/a&gt;&lt;/li&gt;
                  &lt;li class="tab-title"&gt;&lt;a href="#panel2-4"&gt;Tab 4&lt;/a&gt;&lt;/li&gt;
              &lt;/ul&gt;
              &lt;div class="tabs-content"&gt;
                  &lt;div class="content active" id="panel2-1"&gt;
                      &lt;p&gt;First panel content goes here...&lt;/p&gt;
                  &lt;/div&gt;
                  &lt;div class="content" id="panel2-2"&gt;
                      &lt;p&gt;Second panel content goes here...&lt;/p&gt;
                  &lt;/div&gt;
                  &lt;div class="content" id="panel2-3"&gt;
                      &lt;p&gt;Third panel content goes here...&lt;/p&gt;
                  &lt;/div&gt;
                  &lt;div class="content" id="panel2-4"&gt;
                      &lt;p&gt;Fourth panel content goes here...&lt;/p&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  
      &lt;script src="/js/foundation.min.js" type="text/javascript"&gt;&lt;/script&gt;
      &lt;script src="/js/vendor/modernizr.js" type="text/javascript"&gt;&lt;/script&gt;
      &lt;script src="/js/foundation/foundation.tab.js"&gt;&lt;/script&gt;
      &lt;script&gt;
          $(document).foundation();
      &lt;/script&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>