Question

I am newbie to jQuery. I have a form like this

<select name= "menus">
    <option value="">--Select--</option>
    <option value="a">a</option>
    <option value="b">b</option>
    <option value="c">c</option>
    <option value="d">d</option>
    <option value="e">e</option>
</select>

Now I need that when I will click on “a” ,it will make an input field just in another where there it should come like

<input type="text" name="a" />

Any help and suggestions will be highly appreciable.

[edit]
In this way more number of field can be added at a time just like this code

<input type="text" name="a"/>
<input type="text" name="c"/>
<input type="text" name="d"/>

Answer 1

$(function() {
    $('select[name="menus"]').change(function() {
        // fetch the selected value from the dropdown
        var value = $(this).val(); 

        // find the input element with name attribute equal to 
        // the selected value from the dropdown and add some class to it
        $('input[name="' + value + '"]').addClass('foo');
    });
});

When the dropdown list selection changes we add the foo class to the corresponding input element:

<input type="text" name="a" class="foo" />

And here’s a demo.