title: Switch from icons to label in the navbar
body: <p>I have created a website using Bootstrap 3.1.1 and am using the responsive design to allow a collapsable device.</p>
  
  <p>The use cases are:</p>
  
  <ol>
  <li>For the desktop version, the navbar should display icons</li>
  <li>For a smaller width, the dropdown should appear, but use labels instead of icons.</li>
  </ol>
  
  <p>I have created a <a href="http://jsbin.com/rodoc/2/edit" rel="nofollow">JSBin to replicate the scenario</a></p>
  
  <p>Is there a built-in technique for this, or do I move to jQuery to remove the <code>glyphicon</code> classes when the collapse occurs?</p>