I want to populate my drop-down list according to selection on radio button, but my code is not working

Question

I was trying to make a dynamic page using PHP and JS (and HTML, CSS). I wanted to populate a drop-down list on the basis of radio button selected. But the console on Chrome shows the following message:

"Uncaught Syntax Error: Unexpected Error<"

function create_s()
        {
            $('#checking').empty();
            var number = $('#comparea').find('option:selected').attr('number_s');
            //attr('number_s');
            if(number==3){
                $('#checking').append('<input type="radio" class="radio"  id="hd" name="civil" value="sanitation" />sanitation');
                $('#checking').append('<input type="radio" class="radio" name="civil" value="horitculture"/>horitculture');
                $('#checking').append('<input type="radio" class="radio" name="civil" value="water"/>water');
            }
            if(number==2){
                $('#checking').append('<input type="radio" name="telecom" value="telephone"/>telephone');
                $('#checking').append('<input type="radio" name="telecom" value="internet"/>internet');
            }
            if(number==1){
                $('#checking').append('<input type="radio" name="electrical" value="meter"/>meter');
            }
            RadioLoadData();

        }
$('.radio').change(function(){
                    var value = $( this ).attr('value');
                    //var value = ('input[name=civil]:checked', '#myForm').val();
                    document.write("dfhasldhjkh");
                    if(value=="sanitation" || value==="sanitation"){

                        selectcall(100);
                    }
                    if(value=="horitculture" || value==="horitculture"){

                        selectcall(200);
                    }  
                    //alert($('input[name=radioName]:checked', '#myForm').val()); 
            });


function selectcall(value)
            {

               if(value==100){
                $('#selectlist').empty();
                var pcode="<?php              
                mysqli_select_db($conn, $database);
                $sql1 = "SELECT * FROM complaint_area_category WHERE complaint_category_id>100 and complaint_category_id<200 order by complaint_category  ";
                $record = mysqli_query($conn, $sql1);
                while($data=mysqli_fetch_assoc($record)){
                    echo "<option name=".$data['complaint_category_id'].">".$data['complaint_category']."</option>";
                        }
                ?>"
                $('#selectlist').append(pcode);
                }
            }





<select id="selectlist" class="box" style="top:200px" required=""><br><br>
        <option selected="selected" value="">-Select-</option>
        <script >
            //Here different select lists are populated.
        </script>

Answer 1

I found a solution to get it done...

$('#checking').append('<input type="radio" class="radio"  id="cis" name="civil" value="sanitation" onclick="onChange()"/>sanitation');

 function onChange()
            {

                if($('#cis').is(':checked')){
                    selectcall(100);
                }
                if($('#cih').is(':checked')){
                    selectcall(200);
                }

            }

and then the selectcall() funtion as in the question.

Answer 2

Here is updated code try it.

function selectcall(value)
{

    if(value==100){
        $('#selectlist').empty();
        var pcode="<?php"
        mysqli_select_db($conn, $database);
        $sql1 = "SELECT * FROM complaint_area_category WHERE complaint_category_id>100 and complaint_category_id<200 order by complaint_category  ";
        $record = mysqli_query($conn, $sql1);
        $('#selectlist').append('<option selected="selected" value="">-Select-</option');
        while($data=mysqli_fetch_assoc($record)){
            echo ='<option name="'+$data['complaint_category_id']+'">'+$data['+complaint_category']+'"</option>';
        }
        "?>"
        $('#selectlist').append(pcode);
    }
}

<select id="selectlist" class="box" style="top:200px" required=""></select>