How can I retrieve dynamic added content using jQuery?
<p>My scenario is this:<br>
When the page is loaded, a listbox with countries is loaded.</p>

<p>By selecting an item from a dropw down list, a country item in the listbox is selected using jQuery.</p>

<p>Now that a country is selected in the listbox, I call a function which retrieves cities and populate a city listbox.</p>

<p>The code looks something like this:</p>

<pre><code>  $('#MyDropDownList').change(function() {
      (...) // Selected country is set here

      populateCityListBox();

      //this alert is undefined. Probably because it's trigered before the callback in populateCityListBox()
      alert(jQuery('#cityListBox option[value=Oslo]').val()); 
  });

  function populateCityListBox()
  {
    //Get ID for selected country
    var ctryID = jQuery("select#countryListBox").val();

    jQuery.post("wp-content/themes/storelocator/include/jquery_bll.php", { instance: 'getCitiesByCountry', countryID: ctryID },
      function(data)
      {
          var options = '';
          for (var i = 0; i &lt; data.length; i++) {
            options += '&lt;option value="' + data[i].city + '"&gt;' + data[i].city + '&lt;/option&gt;';
          }
          jQuery("select#cityListBox").html(options);

          // This alerts the option text, which also is Oslo
          alert(jQuery('#cityListBox option[value=Oslo]').val()); 
      }, "json");
  }
</code></pre>

<p>My problem is this: I'm not able to retrieve values in the city listbox after I have run the funtion  <code>populateCityListBox();</code>. I <strong>am</strong> able to retrieve values in the $.post callback.</p>

<p>What can I do to be able to retrieve the values after the function is triggered? (I know it has to do something with some stuff being callback, while others run "realtime"... or something like that).</p>
