title: Binding event to chosen select
body: <p>I have this code for a select box which is being displayed by the Chosen jQuery plugin. What I am trying to achieve is to get the value from the current item that has been selected:</p>
  
  <pre><code>&lt;div&gt;
    &lt;select id="schedule_event" name="schedule[event]" style="display: none; " class="chzn-done"&gt;&lt;option value="Game" selected="selected"&gt;Game&lt;/option&gt;
      &lt;option value="Event"&gt;Event&lt;/option&gt;
      &lt;option value="Training"&gt;Training&lt;/option&gt;
    &lt;/select&gt;
    &lt;div id="schedule_event_chzn" class="chzn-container chzn-container-single chzn-container-active" style="width: 854px; "&gt;
      &lt;a href="javascript:void(0)" class="chzn-single chzn-single-with-drop" tabindex="-1"&gt;
        &lt;span&gt;Game&lt;/span&gt;
        &lt;div&gt;&lt;/div&gt;
      &lt;/a&gt;
      &lt;div class="chzn-drop" style="width: 849px; top: 27px; left: 0px; "&gt;
        &lt;div class="chzn-search"&gt;
          &lt;input type="text" autocomplete="off" style="width: 814px; " tabindex="0"&gt;
      &lt;/div&gt;
      &lt;ul class="chzn-results"&gt;
        &lt;li id="schedule_event_chzn_o_0" class="active-result result-selected highlighted" style=""&gt;Game&lt;/li&gt;
        &lt;li id="schedule_event_chzn_o_1" class="active-result" style=""&gt;Event&lt;/li&gt;
        &lt;li id="schedule_event_chzn_o_2" class="active-result" style=""&gt;Training&lt;/li&gt;
      &lt;/ul&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>The JavaScript I'm using at the moment to find the current value is:</p>
  
  <pre><code>$("#schedule_event").chosen().change( function() {
      alert(+ $(this).text());
      $('#' + $(this).val()).show();
  });
  </code></pre>
  
  <p>However, I keep getting a 'NaN', ie no value.</p>