Dynamic <li> in HTML5 using jquery mobile: Problem

Dynamic <li> in HTML5 using jquery mobile: Problem

The code corresponding to the landing page is as follows:
<script type="text/javascript">
        function GetQueryStringParams(sParam) {
            var sPageURL = window.location.search.substring(1);
            var sURLVariables = sPageURL.split('&');
            for (var i = 0; i < sURLVariables.length; i++) {
                var sParameterName = sURLVariables[i].split('=');
                if (sParameterName[0] == sParam) {
                    return sParameterName[1];
                }
            }
        }

        $(document).ready(function () {
            var content = '';
            $('#productsPage').bind('pageshow', function () {

                var categoryId = GetQueryStringParams('id');

                $.support.cors = true;
                $.ajax({
                    type: "POST",
                    url: "services.asmx/GetCategoryByCategoryId",
                    data: "{'categoryId':" + categoryId + "}",
                    contentType: "application/json; charset=utf-8",
                    dataType: "json",
                    success: function (msg) {

                        content = '<li data-role="list-divider" data-theme="a">' + msg.d + '</li>';
                        alert(content);

                    },
                    error: function (err) {
                        alert("err: " + err.responseText);
                    }
                });
                $.ajax({
                    type: "POST",
                    url: "services.asmx/GetProductsByCategoryId",
                    data: "{'categoryId':" + categoryId + "}",
                    contentType: "application/json; charset=utf-8",
                    dataType: "json",
                    success: function (msg) {

                        var products = $.parseJSON(msg.d);
                        $.each(products, function (index, product) {
                            content += '<div data-role="collapsible"   data-collapsed="true" data-theme="c" data-content-theme="d">';
                            content += '<h3>' + product.ProductName + ' </h3>';
                            content += '</div>';
                        });
                        alert(content);
                        $('#products_list').html(content);
                        $('#products_list').listview('refresh');
                        $('#products_list').trigger('create');
                    },
                    error: function (err) {
                        alert("err: " + err.responseText);
                    }
                });



            });
        });

    </script>
Please comment on the above, so as to solve this issue.Thanking you.Alesha Fernandes