Выбор последнего select
 

Добрый день, Господа.

У меня примерно следующая структура страницы:

<div>
   <select onChange="f(this)"></select>
   <select style="display:none"></select>
   <input stype="display:none"/>
</div>

В фукции f я пытаюсь реализовать следующие: если выбрано одно значение то показать input, если другое то select(второй, который пока спрятан) у а если третье то нечего нового не показывать.

Для input у меня получилось вот так:

function f(obj){
  $('input:last-child', $(obj).parent()).show();
}

Но почему-то такой же фокус для select не проходит... Он не как не показываеться

function f(obj){
    $('select:last-child', $(obj).parent()).show();
}

Подскажите как исправить. Заранее спасибо.

Bizon4ik,

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<div>
   <select onchange="$(this).nextAll().hide();$(this).nextAll(this.value).show()">
   <option value='change' >change</option>
   <option value='select'>select</option>
   <option value='input'>input</option></select>
   <select style="display:none"></select>
   <input style="display:none"/>
</div>

Спасибо, за помощь.

А можно еще подсказку, как сделать тоже самое но вместо input у нас будет второй select с display:none. И нужно при выборе в выпадающем списки select1 - показать первый спрятанный select, а если выбрали select2 то второй второй.

<div>
    <select onchange="f(this)">
        <option value='change' >change</option>
        <option value='select1'>select1</option>
        <option value='select2'>select2</option>
    </select>

   <select style="display:none">
          <option value='select1'>select1</option>
   </select>

   <select style="display:none">
          <option value='select2'>select2</option>
   </select>
</div>

Bizon4ik,
пропишите селектам id
value='#ваше_id' вместо