jQuery Mobile: dynamically add ajax data

I was looking for a method to add data to jQuery Mobile page by simultanious AJAX requests.

The problem was that after adding, css was not applied to the html code.

So, the solution was found and here is the code:

<input type="search" name="search" id="search" data-mini="true" />
<ul id="list" data-role="listview" data-inset="true" data-add-back-btn="true" data-split-icon="check">
</ul>

and here is javascript

var combined = [];
        $(document).ready(function(){
            $(document).ajaxStart(function() {

                $.mobile.loading('show');
            });

            $(document).ajaxStop(function() {
                $.mobile.loading('hide');
                $("ul#list").html(combined.join(""));
                $("ul#list").listview("refresh");
            });
            $("#search").keypress(function(e){
                if(e.which == 13) {
                    combined = [];
<?php
foreach ($arraySources as $source)
{

                ?>
                $.post("parsers/search_ajax.php?source=<?php print $source;?>", { search: $(this).val()},function(data){
                    combined.push(data);
                });
               <?php } ?>

                }
            });
        });

Here is the working example of this method “Is it kosher?” web app.