how to make two level select option? : i need make two level select option if selected **bmw** how to show **bmwsubcategory** ? 

if select **audi** how to remove **bmwsubcategory** from html and show **audisubcategory** ?

<!-- begin snippet: js hide: false console: true babel: false -->

<!-- language: lang-html -->

    <select id="category">
    	<option class="bmwsubcategory" value="bmw">bmw</option>
    	<option class="audisubcategory" value="audi">audi</option>
    	<option class="fordsubcategory" value="ford">ford</option>
    	<option class="fiatsubcategory" value="fiat">fiat</option>
    </select>



    <select class="bmwsubcategory" name="bmw">
    	<option value="bmw 1">bmw 1</option>
    	<option value="bmw 2">bmw 2</option>
    	<option value="bmw 3">bmw 3</option>
    	<option value="bmw 4">bmw 4</option>
    </select>

    <select class="audisubcategory" name="audi">
    	<option value="audi 1">audi 1</option>
    	<option value="audi 2">audi 2</option>
    	<option value="audi 3">audi 3</option>
    	<option value="audi 4">audi 4</option>
    </select>

    <select class="fordsubcategory" name="ford">
    	<option value="ford 1">ford 1</option>
    	<option value="ford 2">ford 2</option>
    	<option value="ford 3">ford 3</option>
    	<option value="ford 4">ford 4</option>
    </select>

    <select class="fiatsubcategory" name="fiat">
    	<option value="fiat 1">fiat 1</option>
    	<option value="fiat 2">fiat 2</option>
    	<option value="fiat 3">fiat 3</option>
    	<option value="fiat 4">fiat 4</option>
    </select>

<!-- end snippet -->

