JQuery Mobile select box not displaying selected value?

Question

I have a select box called crop and variety.The variety select box loaded via Ajax depends on the selection of crop and then rendered to JQueryMobile, the value populated correctly.but the selected value not displaying.

What could the reason?

my code:

<script>
            $(document).ready(function() {
                $("#crop").change(function(){
                    $.ajax({
                        type:'GET',
                        url :'variety.php',
                        dataType:"json",
                        //data:"fname=me",
                        data: ({crop: $('#crop').val()}),
                        success : function(data){
                            //                        alert(data);
                            $("#variety").html(data);                               
                        },
                        error : function(data){
                            //                        alert("Error"+data);
                        }
                    });

                });
            });
        </script>
<div data-role="fieldcontain">
                            <label for="crop" class="select">Crop :</label>
                            <select name="crop" id="crop" data-native-menu="false"><option selected>Choose an option</option>
                                <?php
                                while ($res = mysql_fetch_assoc($tests)) {
                                    $dropdown .= "\r\n<option value='{$res['id']}'>{$res['crop_name']}</option>";
                                }
                                echo $dropdown;
                                //}
                                ?>
                            </select>
                        </div>
                        <div data-role="fieldcontain">
                            <label for="variety" class="select">Variety :</label>
                            <select name="variety" id="variety" data-placeholder="true">
                            </select>
                        </div>  
<?php
                    }
                    ?>

Answer 1

You need to call selectmenu('refresh'); on the element that contains the select menu.

$("#variety").html(data).selectmenu('refresh');

Should do it. If not, try:

$("#variety").html(data).selectmenu('refresh', true);