Access Dropdown Box Value When changed via JQuery

Question

Hey, can you help me figure this out? I need to hide/show a div based on a dropdown box (the dropdown box only has a name, no id). If the value of the dropdown box is 2, it needs to be shown and for anything else it needs to be hidden. Here is what I have so far, but it doesn't seem to work (I tried using similar code on a checkbox and it worked fine, so obviously i'm missing something). (It's not possible to modify the dropdown box's code)

JavaScript

$(document).ready(function() {

$('#addons').hide();

$("input[name='configoption[1]']").change(function() {
        if($(this).val() != 2) {
                $('#addons').hide();
        } else
                $('#addons').show();
        } );
});

});

HTML

<select name="configoption[1]"> 
<option value="1" selected="selected">Test 1</option> 
<option value="2">Test 2</option> 
</select>
<div id="addons">
Hi
</div>    

Answer 1

It seems you just simply specified the wrong element name, input should be select.

$("select[name='configoption[1]']")

make sure you are getting the element by doing this:

alert( $("select[name='configoption[1]']").length )

it should be anything other than 0.

Answer 2

Use an onchange option. Change

<select name="configoption[1]">

to

<select name="configoption[1]" onchange="javascript:function;">