title: Where are Bootstrap 3's .hidden- & .visible- for phone, tablet & desktop?
body: <p>I have a specific requirement for my JQuery plugins to "know" what size Bootstrap is using (e.g. xs, sm, md, lg phone, tablet or desktop), so I decided to add classes to the body tag I could query.</p>
  
  <p>Based on a couple of examples around the net I came up with this JQuery for Bootstrap I call jstrap:</p>
  
  <h2><a href="http://jsfiddle.net/TrueBlueAussie/52VtD/3767/" rel="nofollow noreferrer">http://jsfiddle.net/TrueBlueAussie/52VtD/3767/</a></h2>
  
  <p>If you resize the output pane width, you will see the colours change based on the bootstrap size.</p>
  
  <pre><code>// Detect current bootstrap "size" and set appropriate "Size-" class on body element to allow for jQuery access (and additional styling)
  function jstrap()
  {
      var sizes = ["lg", "md", "sm", "xs", "phone", "tablet", "desktop"];
      var $el = $('&lt;div&gt;'),
          $body = $('body');
      $body.append($el);
      for (var i = 0; i &lt; 7; i++)
      {
          var size = sizes[i];
          if ($el.addClass('hidden-' + size).is(':hidden'))
          {
              // Decorate body with a size class
              $body.addClass("Size-" + size);
          }
          else
          {
              // Remove this size (if previously present) as not applicable
              $body.removeClass("Size-" + size);
          }
      };
      $el.remove();
  }
  // Call jstrap on DOM load and on window resize
  $(function ()
  {
      $(window).resize(function ()
      {
          jstrap();
      });
      jstrap();
  });
  </code></pre>
  
  <p>It sets <code>Size-</code> styles on the <code>body</code> element, based on the current bootstrap styling, but I found that the .hidden-phone, .hidden-tablet &amp; .hidden-desktop do not appear to work. According to another post <a href="https://stackoverflow.com/questions/20598656/responsive-less-and-other-responsive-less-files-missing-from-bootstrap">responsive.less and other responsive less files missing from Bootstrap</a> that functionality is included in bootstrap 3, but it appears to always have .hidden-desktop, .hidden-tablet and .hidden-phone set.</p>
  
  <p>What am I missing?</p>
  
  <p><em>Note: this is formatted for .less, so no complaints about the code formatting :)</em></p>