retrieving data from database using pdo and put it iside an option tag

Question

i have two combo box and of them are having values from database, what i want is that when i choose on of the option in the first combo box the options in the second combo box will change based on the selected box,. i found a piece of code that works as what i intended but the problem is its static what i want is dynamic, here's the code i found, compare it to mine and please correct mine.

HTML:

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<select id="type">
    <option value="item1">item1</option>
    <option value="item2">item2</option>
    <option value="item3">item3</option>
</select>

<select id="size">
    <option value="">-- select one -- </option>
</select>  

javascript:

$(document).ready(function () {
$("#type").change(function () {
var val = $(this).val();
if (val == "item1") {
$("#size").html("<option value='test'>item1: test 1</option><option value='test2'>item1: test 2</option>");
 } else if (val == "item2") {
 $("#size").html("<option value='test'>item2: test 1</option><option value='test2'>item2: test 2</option>");
} else if (val == "item3") {
$("#size").html("<option value='test'>item3: test 1</option><option value='test2'>item3: test 2</option>");
    }
});
});  

now here's mine, I have a datase for the first combo box and it works since it's outside the tag. for the first data base i have attributes like sex_id and value with the data (men, women). and for the second combo box which will change based on the selected option I have table name lala with attributes of id, sex_id, category with the values of men1, men2, men3, women1,women2, women3.(the two tables are connected or relatioship. ) when i chose men the second combobox must have this values men1, men2, men3. and for the women we have women1, women2, women3. here's how i did it.
html:

<select class ="form-control" id="age" name="gender">
<option value="" selected> - Gender -</option>
<?php
$sql = "SELECT * from sex";
$q= $conn->query($sql);
$q->setFetchMode (PDO::FETCH_ASSOC);

while($r = $q->fetch())
{
?>
<option value="<?php echo $r['value']?>"> <?php echo $r['value']?>  </option>

<?php

}?>
</select>
<select class ="form-control" id="sex" name="gender">
<option value="" selected>- Age Span -</option>

</select> 

javascript:

<script>
$(document).ready(function () {
$("#age").change(function () {
var val = $(this).val();
global $sql;
if (val == "the value here will be dyna,ic based on the selected option") {
global $sql;
$sql = "SELECT * from sex";
$q= $conn->query($sql);
$q->setFetchMode (PDO::FETCH_ASSOC);
while($r = $q->fetch())
{
$("#sex").html("<option value='test'>" + $r['haha'] + " </option><option value='test2'>item1: test 2</option>");
}
}
} 
});
});