title: jQuery - MixItUp change default Active tab content
body: <p>I am using <strong>jQuery - MixItUp</strong> portfolio plugin.</p>
  
  <p>How can show default tab content as "<strong><code>Icon Tab</code></strong>" <strong>with relevant content</strong> instead of "<strong><code>All</code></strong>"</p>
  
  <p>Tab Active is working fine where as content is not changing...</p>
  
  <hr>
  
  <blockquote>
    <p><strong><a href="http://codepen.io/anon/pen/GJaLGo" rel="nofollow">Online Demo</a></strong></p>
  </blockquote>
  
  <hr>
  
  <p><strong>jQuery</strong></p>
  
  <hr>
  
  <pre><code>$(function () {
  
    var filterList = {
  
      init: function () {
  
        // MixItUp plugin
        // http://mixitup.io
        $('#portfoliolist').mixitup({
          targetSelector: '.portfolio',
          filterSelector: '.filter',
          effects: ['fade'],
          easing: 'snap',
          // call the hover effect
          onMixEnd: filterList.hoverEffect()
        });               
  
      },
  
      hoverEffect: function () {
  
        // Simple parallax effect
        $('#portfoliolist .portfolio').hover(
          function () {
            $(this).find('.label').stop().animate({bottom: 0}, 200, 'easeOutQuad');
            $(this).find('img').stop().animate({top: -30}, 500, 'easeOutQuad');               
          },
          function () {
            $(this).find('.label').stop().animate({bottom: -40}, 200, 'easeInQuad');
            $(this).find('img').stop().animate({top: 0}, 300, 'easeOutQuad');                             
          }       
        );                
  
      }
  
    };
  
    // Run the show!
    filterList.init();
  
  
  }); 
  </code></pre>
  
  <p><strong>HTML</strong></p>
  
  <hr>
  
  <pre><code>&lt;div class="container"&gt;
  
    &lt;ul id="filters" class="clearfix"&gt;
      &lt;li&gt;&lt;span class="filter" data-filter="app card icon logo web"&gt;All&lt;/span&gt;&lt;/li&gt;
      &lt;li&gt;&lt;span class="filter" data-filter="app"&gt;App&lt;/span&gt;&lt;/li&gt;
      &lt;li&gt;&lt;span class="filter" data-filter="card"&gt;Card&lt;/span&gt;&lt;/li&gt;
      &lt;li&gt;&lt;span class="filter active" data-filter="icon"&gt;Icon&lt;/span&gt;&lt;/li&gt;
      &lt;li&gt;&lt;span class="filter" data-filter="logo"&gt;Logo&lt;/span&gt;&lt;/li&gt;
      &lt;li&gt;&lt;span class="filter" data-filter="web"&gt;Web&lt;/span&gt;&lt;/li&gt;
    &lt;/ul&gt;
  
    &lt;div id="portfoliolist"&gt;
  
      &lt;div class="portfolio logo" data-cat="logo"&gt;
        &lt;div class="portfolio-wrapper"&gt;               
          &lt;img src="http://www.queness.com/resources/html/simple-portfolio-page/img/portfolios/logo/5.jpg" alt="" /&gt;
          &lt;div class="label"&gt;
            &lt;div class="label-text"&gt;
              &lt;a class="text-title"&gt;Bird Document&lt;/a&gt;
              &lt;span class="text-category"&gt;Logo&lt;/span&gt;
            &lt;/div&gt;
            &lt;div class="label-bg"&gt;&lt;/div&gt;
          &lt;/div&gt;
        &lt;/div&gt;
      &lt;/div&gt;              
  
      &lt;div class="portfolio app" data-cat="app"&gt;
        &lt;div class="portfolio-wrapper"&gt;           
          &lt;img src="http://www.queness.com/resources/html/simple-portfolio-page/img/portfolios/app/1.jpg" alt="" /&gt;
          &lt;div class="label"&gt;
            &lt;div class="label-text"&gt;
              &lt;a class="text-title"&gt;Visual Infography&lt;/a&gt;
              &lt;span class="text-category"&gt;APP&lt;/span&gt;
            &lt;/div&gt;
            &lt;div class="label-bg"&gt;&lt;/div&gt;
          &lt;/div&gt;
        &lt;/div&gt;
      &lt;/div&gt;      
  
      &lt;div class="portfolio web" data-cat="web"&gt;
        &lt;div class="portfolio-wrapper"&gt;                       
          &lt;img src="http://www.queness.com/resources/html/simple-portfolio-page/img/portfolios/web/4.jpg" alt="" /&gt;
          &lt;div class="label"&gt;
            &lt;div class="label-text"&gt;
              &lt;a class="text-title"&gt;Sonor's Design&lt;/a&gt;
              &lt;span class="text-category"&gt;Web design&lt;/span&gt;
            &lt;/div&gt;
            &lt;div class="label-bg"&gt;&lt;/div&gt;
          &lt;/div&gt;
        &lt;/div&gt;
      &lt;/div&gt;              
  
      &lt;div class="portfolio card" data-cat="card"&gt;
        &lt;div class="portfolio-wrapper"&gt;           
          &lt;img src="http://www.queness.com/resources/html/simple-portfolio-page/img/portfolios/card/1.jpg" alt="" /&gt;
          &lt;div class="label"&gt;
            &lt;div class="label-text"&gt;
              &lt;a class="text-title"&gt;Typography Company&lt;/a&gt;
              &lt;span class="text-category"&gt;Business card&lt;/span&gt;
            &lt;/div&gt;
            &lt;div class="label-bg"&gt;&lt;/div&gt;
          &lt;/div&gt;
        &lt;/div&gt;
      &lt;/div&gt;  
  
      &lt;div class="portfolio app" data-cat="app"&gt;
        &lt;div class="portfolio-wrapper"&gt;
          &lt;img src="http://www.queness.com/resources/html/simple-portfolio-page/img/portfolios/app/3.jpg" alt="" /&gt;
          &lt;div class="label"&gt;
            &lt;div class="label-text"&gt;
              &lt;a class="text-title"&gt;Weatherette&lt;/a&gt;
              &lt;span class="text-category"&gt;APP&lt;/span&gt;
            &lt;/div&gt;
            &lt;div class="label-bg"&gt;&lt;/div&gt;
          &lt;/div&gt;
        &lt;/div&gt;
      &lt;/div&gt;          
  
      &lt;div class="portfolio card" data-cat="card"&gt;
        &lt;div class="portfolio-wrapper"&gt;           
          &lt;img src="http://www.queness.com/resources/html/simple-portfolio-page/img/portfolios/card/4.jpg" alt="" /&gt;
          &lt;div class="label"&gt;
            &lt;div class="label-text"&gt;
              &lt;a class="text-title"&gt;BMF&lt;/a&gt;
              &lt;span class="text-category"&gt;Business card&lt;/span&gt;
            &lt;/div&gt;
            &lt;div class="label-bg"&gt;&lt;/div&gt;
          &lt;/div&gt;
        &lt;/div&gt;
      &lt;/div&gt;  
  
      &lt;div class="portfolio card" data-cat="card"&gt;
        &lt;div class="portfolio-wrapper"&gt;           
          &lt;img src="http://www.queness.com/resources/html/simple-portfolio-page/img/portfolios/card/5.jpg" alt="" /&gt;
          &lt;div class="label"&gt;
            &lt;div class="label-text"&gt;
              &lt;a class="text-title"&gt;Techlion&lt;/a&gt;
              &lt;span class="text-category"&gt;Business card&lt;/span&gt;
            &lt;/div&gt;
            &lt;div class="label-bg"&gt;&lt;/div&gt;
          &lt;/div&gt;
        &lt;/div&gt;
      &lt;/div&gt;  
  
      &lt;div class="portfolio logo" data-cat="logo"&gt;
        &lt;div class="portfolio-wrapper"&gt;           
          &lt;img src="http://www.queness.com/resources/html/simple-portfolio-page/img/portfolios/logo/1.jpg" alt="" /&gt;
          &lt;div class="label"&gt;
            &lt;div class="label-text"&gt;
              &lt;a class="text-title"&gt;KittyPic&lt;/a&gt;
              &lt;span class="text-category"&gt;Logo&lt;/span&gt;
            &lt;/div&gt;
            &lt;div class="label-bg"&gt;&lt;/div&gt;
          &lt;/div&gt;
        &lt;/div&gt;
      &lt;/div&gt;                                                                                                                                                          
  
      &lt;div class="portfolio app" data-cat="app"&gt;
        &lt;div class="portfolio-wrapper"&gt;           
          &lt;img src="http://www.queness.com/resources/html/simple-portfolio-page/img/portfolios/app/2.jpg" alt="" /&gt;
          &lt;div class="label"&gt;
            &lt;div class="label-text"&gt;
              &lt;a class="text-title"&gt;Graph Plotting&lt;/a&gt;
              &lt;span class="text-category"&gt;APP&lt;/span&gt;
            &lt;/div&gt;
            &lt;div class="label-bg"&gt;&lt;/div&gt;
          &lt;/div&gt;
        &lt;/div&gt;
      &lt;/div&gt;                                                      
  
      &lt;div class="portfolio card" data-cat="card"&gt;
        &lt;div class="portfolio-wrapper"&gt;           
          &lt;img src="http://www.queness.com/resources/html/simple-portfolio-page/img/portfolios/card/2.jpg" alt="" /&gt;
          &lt;div class="label"&gt;
            &lt;div class="label-text"&gt;
              &lt;a class="text-title"&gt;QR Quick Response&lt;/a&gt;
              &lt;span class="text-category"&gt;Business card&lt;/span&gt;
            &lt;/div&gt;
            &lt;div class="label-bg"&gt;&lt;/div&gt;
          &lt;/div&gt;
        &lt;/div&gt;
      &lt;/div&gt;              
  
      &lt;div class="portfolio logo" data-cat="logo"&gt;
        &lt;div class="portfolio-wrapper"&gt;           
          &lt;img src="http://www.queness.com/resources/html/simple-portfolio-page/img/portfolios/logo/6.jpg" alt="" /&gt;
          &lt;div class="label"&gt;
            &lt;div class="label-text"&gt;
              &lt;a class="text-title"&gt;Mobi Sock&lt;/a&gt;
              &lt;span class="text-category"&gt;Logo&lt;/span&gt;
            &lt;/div&gt;
            &lt;div class="label-bg"&gt;&lt;/div&gt;
          &lt;/div&gt;
        &lt;/div&gt;
      &lt;/div&gt;                                                                  
  
      &lt;div class="portfolio logo" data-cat="logo"&gt;
        &lt;div class="portfolio-wrapper"&gt;           
          &lt;img src="http://www.queness.com/resources/html/simple-portfolio-page/img/portfolios/logo/7.jpg" alt="" /&gt;
          &lt;div class="label"&gt;
            &lt;div class="label-text"&gt;
              &lt;a class="text-title"&gt;Village Community Church&lt;/a&gt;
              &lt;span class="text-category"&gt;Logo&lt;/span&gt;
            &lt;/div&gt;
            &lt;div class="label-bg"&gt;&lt;/div&gt;
          &lt;/div&gt;
        &lt;/div&gt;
      &lt;/div&gt;                                                  
  
      &lt;div class="portfolio icon" data-cat="icon"&gt;
        &lt;div class="portfolio-wrapper"&gt;           
          &lt;img src="http://www.queness.com/resources/html/simple-portfolio-page/img/portfolios/icon/4.jpg" alt="" /&gt;
          &lt;div class="label"&gt;
            &lt;div class="label-text"&gt;
              &lt;a class="text-title"&gt;Domino's Pizza&lt;/a&gt;
              &lt;span class="text-category"&gt;Icon&lt;/span&gt;
            &lt;/div&gt;
            &lt;div class="label-bg"&gt;&lt;/div&gt;
          &lt;/div&gt;
        &lt;/div&gt;
      &lt;/div&gt;                          
  
      &lt;div class="portfolio web" data-cat="web"&gt;
        &lt;div class="portfolio-wrapper"&gt;                       
          &lt;img src="http://www.queness.com/resources/html/simple-portfolio-page/img/portfolios/web/3.jpg" alt="" /&gt;
          &lt;div class="label"&gt;
            &lt;div class="label-text"&gt;
              &lt;a class="text-title"&gt;Backend Admin&lt;/a&gt;
              &lt;span class="text-category"&gt;Web design&lt;/span&gt;
            &lt;/div&gt;
            &lt;div class="label-bg"&gt;&lt;/div&gt;
          &lt;/div&gt;
        &lt;/div&gt;
      &lt;/div&gt;                                                                                              
  
      &lt;div class="portfolio icon" data-cat="icon"&gt;
        &lt;div class="portfolio-wrapper"&gt;           
          &lt;img src="http://www.queness.com/resources/html/simple-portfolio-page/img/portfolios/icon/1.jpg" alt="" /&gt;
          &lt;div class="label"&gt;
            &lt;div class="label-text"&gt;
              &lt;a class="text-title"&gt;Instagram&lt;/a&gt;
              &lt;span class="text-category"&gt;Icon&lt;/span&gt;
            &lt;/div&gt;
            &lt;div class="label-bg"&gt;&lt;/div&gt;
          &lt;/div&gt;
        &lt;/div&gt;
      &lt;/div&gt;              
  
      &lt;div class="portfolio web" data-cat="web"&gt;
        &lt;div class="portfolio-wrapper"&gt;                       
          &lt;img src="http://www.queness.com/resources/html/simple-portfolio-page/img/portfolios/web/2.jpg" alt="" /&gt;
          &lt;div class="label"&gt;
            &lt;div class="label-text"&gt;
              &lt;a class="text-title"&gt;Student Guide&lt;/a&gt;
              &lt;span class="text-category"&gt;Web design&lt;/span&gt;
            &lt;/div&gt;
            &lt;div class="label-bg"&gt;&lt;/div&gt;
          &lt;/div&gt;
        &lt;/div&gt;
      &lt;/div&gt;                                                                  
  
      &lt;div class="portfolio icon" data-cat="icon"&gt;
        &lt;div class="portfolio-wrapper"&gt;
          &lt;img src="http://www.queness.com/resources/html/simple-portfolio-page/img/portfolios/icon/2.jpg" alt="" /&gt;
          &lt;div class="label"&gt;
            &lt;div class="label-text"&gt;
              &lt;a class="text-title"&gt;Scoccer&lt;/a&gt;
              &lt;span class="text-category"&gt;Icon&lt;/span&gt;
            &lt;/div&gt;
            &lt;div class="label-bg"&gt;&lt;/div&gt;
          &lt;/div&gt;
        &lt;/div&gt;
      &lt;/div&gt;                                                                                                                                                                                                                                                              
  
      &lt;div class="portfolio icon" data-cat="icon"&gt;
        &lt;div class="portfolio-wrapper"&gt;                       
          &lt;img src="http://www.queness.com/resources/html/simple-portfolio-page/img/portfolios/icon/5.jpg" alt="" /&gt;
          &lt;div class="label"&gt;
            &lt;div class="label-text"&gt;
              &lt;a class="text-title"&gt;3D Map&lt;/a&gt;
              &lt;span class="text-category"&gt;Icon&lt;/span&gt;
            &lt;/div&gt;
            &lt;div class="label-bg"&gt;&lt;/div&gt;
          &lt;/div&gt;
        &lt;/div&gt;
      &lt;/div&gt;          
  
      &lt;div class="portfolio web" data-cat="web"&gt;
        &lt;div class="portfolio-wrapper"&gt;                       
          &lt;img src="http://www.queness.com/resources/html/simple-portfolio-page/img/portfolios/web/1.jpg" alt="" /&gt;
          &lt;div class="label"&gt;
            &lt;div class="label-text"&gt;
              &lt;a class="text-title"&gt;Note&lt;/a&gt;
              &lt;span class="text-category"&gt;Web design&lt;/span&gt;
            &lt;/div&gt;
            &lt;div class="label-bg"&gt;&lt;/div&gt;
          &lt;/div&gt;
        &lt;/div&gt;
      &lt;/div&gt;                                  
  
      &lt;div class="portfolio logo" data-cat="logo"&gt;
        &lt;div class="portfolio-wrapper"&gt;           
          &lt;img src="http://www.queness.com/resources/html/simple-portfolio-page/img/portfolios/logo/3.jpg" alt="" /&gt;
          &lt;div class="label"&gt;
            &lt;div class="label-text"&gt;
              &lt;a class="text-title"&gt;Native Designers&lt;/a&gt;
              &lt;span class="text-category"&gt;Logo&lt;/span&gt;
            &lt;/div&gt;
            &lt;div class="label-bg"&gt;&lt;/div&gt;
          &lt;/div&gt;
        &lt;/div&gt;
      &lt;/div&gt;                                                                  
  
      &lt;div class="portfolio logo" data-cat="logo"&gt;
        &lt;div class="portfolio-wrapper"&gt;           
          &lt;img src="http://www.queness.com/resources/html/simple-portfolio-page/img/portfolios/logo/4.jpg" alt="" /&gt;
          &lt;div class="label"&gt;
            &lt;div class="label-text"&gt;
              &lt;a class="text-title"&gt;Bookworm&lt;/a&gt;
              &lt;span class="text-category"&gt;Logo&lt;/span&gt;
            &lt;/div&gt;
            &lt;div class="label-bg"&gt;&lt;/div&gt;
          &lt;/div&gt;
        &lt;/div&gt;
      &lt;/div&gt;                                                                                                              
  
      &lt;div class="portfolio icon" data-cat="icon"&gt;
        &lt;div class="portfolio-wrapper"&gt;           
          &lt;img src="http://www.queness.com/resources/html/simple-portfolio-page/img/portfolios/icon/3.jpg" alt="" /&gt;
          &lt;div class="label"&gt;
            &lt;div class="label-text"&gt;
              &lt;a class="text-title"&gt;Sandwich&lt;/a&gt;
              &lt;span class="text-category"&gt;Icon&lt;/span&gt;
            &lt;/div&gt;
            &lt;div class="label-bg"&gt;&lt;/div&gt;
          &lt;/div&gt;
        &lt;/div&gt;
      &lt;/div&gt;                                                                                              
  
      &lt;div class="portfolio card" data-cat="card"&gt;
        &lt;div class="portfolio-wrapper"&gt;           
          &lt;img src="http://www.queness.com/resources/html/simple-portfolio-page/img/portfolios/card/3.jpg" alt="" /&gt;
          &lt;div class="label"&gt;
            &lt;div class="label-text"&gt;
              &lt;a class="text-title"&gt;Reality&lt;/a&gt;
              &lt;span class="text-category"&gt;Business card&lt;/span&gt;
            &lt;/div&gt;
            &lt;div class="label-bg"&gt;&lt;/div&gt;
          &lt;/div&gt;
        &lt;/div&gt;
      &lt;/div&gt;  
  
      &lt;div class="portfolio logo" data-cat="logo"&gt;
        &lt;div class="portfolio-wrapper"&gt;           
          &lt;img src="http://www.queness.com/resources/html/simple-portfolio-page/img/portfolios/logo/2.jpg" alt="" /&gt;
          &lt;div class="label"&gt;
            &lt;div class="label-text"&gt;
              &lt;a class="text-title"&gt;Speciallisterne&lt;/a&gt;
              &lt;span class="text-category"&gt;Logo&lt;/span&gt;
            &lt;/div&gt;
            &lt;div class="label-bg"&gt;&lt;/div&gt;
          &lt;/div&gt;
        &lt;/div&gt;
      &lt;/div&gt;              
  
  
    &lt;/div&gt;
  
  &lt;/div&gt;&lt;!-- container --&gt;
  </code></pre>