Bootstrap-select - wie man ein Ereignis bei Änderung auslöst

Ich verwende Bootstrap 3.0.2 und das Bootstrap-select plugin.

Hier ist meine Auswahlliste:

<select class="selectpicker" data-live-search="true" data-size="7">
  <option>Petr Karel</option>
  <option>Honza Novák</option>
  <option>David Egydy</option>
  <option>Sláva Kovář</option>
  <option>Hana Skalická</option>
  <option>Simona Kolářová</option>
  <option>Kateřina Sychová</option>
  <option>Amálka Sychová</option>
  <option>Jana Sychová</option>
  <option>Magdaléna Sychová</option>
  <option>Tereza Sychová</option>
  <option>Bohdana Sychová</option>
</select>

Hier ist mein JavaScript:

//inicialization of select picker
$('.selectpicker').selectpicker();

//on change function i need to control selected value
$('select.selectpicker').on('change', function(){
   var selected = $('.selectpicker option:selected').val();
   alert(selected);
});
Proble

Mein Problem ist, dass die Änderungsfunktion nicht funktioniert. Es macht nichts und ich kann keine Lösung für mich finden.

Wenn ich es in das Dokument bereitstelle, scheint die Änderungsfunktion zu funktionieren. Also habe ich wohl irgendwo einen Fehler in:

$('select.selectpicker').on('change', function(){

Ich habe auch versucht, nur zu verwenden:

$('.selectpicker').on('change', function(){

ohne dieses Auswahlpräfix ändert sich aber nichts.

AKTUALISIERE

Lösung setzt JQuery-Code indocument.ready(). Dank an Kartikeya

Antworten auf die Frage(5)

Ihre Antwort auf die Frage