Merhaba,

<select name="" class="renk">
    <option value="KIRMIZI/S">KIRMIZI/S</option>
    <option value="KIRMIZI/M">KIRMIZI/M</option>
    <option value="KIRMIZI/L">KIRMIZI/L</option>
    <option value="KIRMIZI/XL">KIRMIZI/XL</option>
    <option value="MAVİ/S">MAVİ/S</option>
    <option value="MAVİ/M">MAVİ/M</option>
    <option value="MAVİ/L">MAVİ/L</option>
    <option value="MAVİ/XL">MAVİ/XL</option>
    <option value="TURUNCU/S">TURUNCU/S</option>
    <option value="TURUNCU/M">TURUNCU/M</option>
</select>
bu şekilde select menum var.

bu select menüyü 2 adet select e çevirmek istiyorum mesela.

Mavi ye geldiğinde s,m,l,xl gelsin turuncu ya tıkladığında 2. select de s.m gelsin sadece ve 2 seçimi de yaptıktan sonra en üsteki örnek select menüde o option seçilmiş olsun.

Ben buraya kadar yaptım ama devamını yardım bekliyorum.

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<script src="jquery-2.1.4.min.js"></script>
    <script>
		$(document).ready(function(e) {
			var onceki = "";
            $(".renk option").each(function() {
                var yazi = $(this).text();
        		var arr = yazi.split('/');
				if (onceki == arr[0]){
					$(".beden").prepend("<option value='"+$(this).val()+"'>"+arr[1]+"</option>");	
					
				}
				else {
					onceki = arr[0];
					$(".renk2").prepend("<option value='"+$(this).val()+"'>"+arr[0]+"</option>");	
					$(".beden").prepend("<option value='"+$(this).val()+"'>"+arr[1]+"</option>");
				}
            });
			
			$(".renk2").click(function(){
				$(".beden").css("display","block");
				
				var value = $(this).val();
				var arr2 = value.split('/');
				
				var value2 = $(".beden option").val();
				var arr3 = value2.split('/');
				
				$(".beden").find(arr2[0]).css("color","red");
				
			});
        });
	</script>
</head>
<body>
<select name="" class="renk">
    <option value="KIRMIZI/S">KIRMIZI/S</option>
    <option value="KIRMIZI/M">KIRMIZI/M</option>
    <option value="KIRMIZI/L">KIRMIZI/L</option>
    <option value="KIRMIZI/XL">KIRMIZI/XL</option>
    <option value="MAVİ/S">MAVİ/S</option>
    <option value="MAVİ/M">MAVİ/M</option>
    <option value="MAVİ/L">MAVİ/L</option>
    <option value="MAVİ/XL">MAVİ/XL</option>
    <option value="TURUNCU/S">TURUNCU/S</option>
    <option value="TURUNCU/M">TURUNCU/M</option>
</select>
<div id="sonuc">
	<select class="renk2"></select>
    <select class="beden" style="display:none;"></select>
</div>
</body>
</html>