Get immediate nect drop down to the current dropdown

Here is my HTML Code.

   <table>
   <tr>
   <select class="dropdown">
   <option value="">Select answer</option>
   <option value="1" selected="selected">A</option>
   <option value="2">B</option>
   <option value="3">C</option>
   </select>
   </td>
   <td>
   <select class="dropdown">
   <option value="">Select answer</option>
   <option value="1" >Yes</option>
   <option value="2">No</option>
   <option value="3">N.A.</option>
   </select>
   </td>
   </tr>
   <td>
   <select class="dropdown">
   <option value="">开发者_JAVA百科;Select answer</option>
   <option value="1" >Yes</option>
   <option value="2">No</option>
   <option value="3">N.A.</option>
   </select>
   </td>
   </table>

Here is my jquery code.

                    $('TABLE TR').find('select:gt(1)').prop('disabled',true)
                    $('TABLE TR').find('select').bind('change',function()
                    {
               $(this).next('select').prop('disabled',false)                          
      });

I want to enable the immediate next drop down value based on the value of first dropdown box. Please someone help..

---

modify as per your need

$("select.dropdown").change(function(){
if($(this).val()==='2')
{  
   $(this).nextAll().find("select:first").prop("disabled",true);
}

});

http://jsfiddle.net/4ShsC/1/

---

Try this fiddle: http://jsfiddle.net/xJVam/

In this example the second dropdown only become enabled when B selected and the third become enabled when C selected. However I'm not sure what did you want.

---

Another approach:

var $selects = $('table tr select');

$selects.each(function(i) {
    $(this).prop('disabled', i != 0)
           .bind('change', function() {
                $selects.eq(i + 1).prop('disabled', false);
            });
});

(demo)

Note: A missing <td> and <tr> ... </tr> was inserted.