title: How to create a toggle button in Bootstrap
body: <p>I originally created a web app in HTML, CSS and JavaScript, then was asked to create it again in Bootstrap too. I've done it all fine, but I had toggle buttons in the web app that have changed back to radio (originally checkbox) buttons instead of the toggle buttons I had originally.</p>
  
  <p>The code for the buttons is:</p>
  
  <pre><code>&lt;label&gt;
    Notifications
    &lt;span class='toggle'&gt;
      &lt;input type='radio'
        class='notifications'
        name='notifications'
        id='notifications' /&gt;
    &lt;/span&gt;
  &lt;/li&gt;
  &lt;label&gt;
    Preview
    &lt;span class='toggle'&gt;
      &lt;input type='radio'
        class='preview'
        name='preview'
        id='preview' /&gt;
    &lt;/span&gt;
  &lt;/li&gt;
  </code></pre>
  
  <p>and the JavaScript and CSS files that the HTML page is linked to are:</p>
  
  <pre><code>&lt;script src = 'jqtouch.js'&gt;&lt;/script&gt;
  &lt;script src="jquery.js"&gt;&lt;/script&gt;
  &lt;script src="js/bootstrap.js"&gt;&lt;/script&gt;
  &lt;link href="css/bootstrap.css" rel="stylesheet"&gt;
  &lt;link href="css/bootstrap-responsive.css" rel="stylesheet"&gt;
  </code></pre>
  
  <p>Is there a way to change the code so I can get the toggle button back?</p>