title: bootstrap switch setState using a jquery function
body: <p>I'm trying to set the state of a bootstrap switch with two external buttons, this is the code:</p>
  
  <pre><code>    &lt;div&gt;
          &lt;input type="checkbox" name="switch" id="switch" value="1" data-on-text="ON" data-off-text="OFF" /&gt;
      &lt;/div&gt;
  
      &lt;div&gt;
          &lt;a id="set_on"&gt;ON&lt;/a&gt;
          &lt;a id="set_off"&gt;OFF&lt;/a&gt;
      &lt;/div&gt;
  
  &lt;script src="assets/jquery.min.js" type="text/javascript"&gt;&lt;/script&gt;
  &lt;script src="assets/jquery-ui.min.js" type="text/javascript"&gt;&lt;/script&gt;
  &lt;script src="assets/bootstrap.min.js" type="text/javascript"&gt;&lt;/script&gt;
  &lt;script src="assets/bootstrap-switch.js"&gt;&lt;/script&gt;
  &lt;script&gt;
      $("#switch").bootstrapSwitch();
      $( "#set_on" ).click(function() {
          $("#switch").bootstrapSwitch('setState', true);
      });
      $( "#set_off" ).click(function() {
          $("#switch").bootstrapSwitch('setState', false);
      });
  &lt;/script&gt;
  </code></pre>
  
  <p>Clicking on the buttons ON or OFF the switch no not toggle its state.
  Looking on the console of the browser I read this error:
  <strong>TypeError: $(...).bootstrapSwitch is not a function</strong></p>
  
  <p>If I try to set the State of the bootstrap switch outside the function in this way:</p>
  
  <pre><code>&lt;script&gt;
      $("#switch").bootstrapSwitch();
      $("#switch").bootstrapSwitch('setState', false);
  &lt;/script&gt;
  </code></pre>
  
  <p>the switch toggle correctly to the ON state.</p>