title: Bootstrap toggle doesn't display well when added dynamically
body: <p>I'm trying to add bootstrap toggle switch dynamically but it does not display well after adding it. Thanks for your help!</p>
  
  <pre class="lang-html prettyprint-override"><code>&lt;input id="TheCheckBox" type="checkbox" data-off-text="Yes" data-on-text="No" checked="false" class="BSswitch"&gt;
  
  &lt;p&gt; &lt;a class="btn btn-lg btn-primary" href="#"&gt;Display another Toggle&lt;/a&gt;&lt;/p&gt;
  </code></pre>
  
  
  
  
  
  <pre class="lang-js prettyprint-override"><code>$('.btn').on('click', function () {
      $('p').after(
          '&lt;input id="TheCheckBox" type="checkbox" data-off-text="Male" data-on-text="Female" checked="false" class="BSswitch"&gt;'
      );
  });
  </code></pre>
  
  <p>This is the Jsfiddle: <a href="http://jsfiddle.net/icamilo95/8wars2ep/3/" rel="nofollow">http://jsfiddle.net/icamilo95/8wars2ep/3/</a></p>