How to change a seleclist options from another selectlist?

I have two seleclists. I want to filter second selectlist options from first select list.

Here is the code:

$(document).ready(function() {
    $('#sehir').change(function() {
        var sehir = $(this).find('option:selected').text();
        var options = $('#ilce').filter('[label=' + sehir + ']');
        $('#ilce').html(options);
    });
});

And first selectlist:

<select name="sehirid" id="sehir" class="form-control">
    <option value="1">Option 1</option>
    <option value="2">Option 2</option>
    <option value="3">Option 3</option>
</select>

Second selectlist:

<select name="ilceid" id="ilce" class="form-control">
    <optgroup label="Option 1">
        <option parent="Option 1" value="1">Option 1</option>
        <option parent="Option 1" value="2">Option 2</option>
        <option parent="Option 1" value="3">Option 3</option>
    </optgroup>
    <optgroup label="Option 2">
        <option parent="Option 2" value="1">Option 1</option>
        <option parent="Option 2" value="2">Option 2</option>
        <option parent="Option 2" value="3">Option 3</option>
    </optgroup>
    <optgroup label="Option 3">
        <option parent="Option 3" value="1">Option 1</option>
        <option parent="Option 3" value="2">Option 2</option>
        <option parent="Option 3" value="3">Option 3</option>
    </optgroup>
</select>

But this code is not working. What's wrong?

via Chebli Mohamed