Display other input when option is selected

Display other input when option is selected


I have a form with a table that contains a list of names. For each
name there are two drop downs - relationship1 and relationship2. When
the user selects the option, Other Relative or Other household member,
I need a text input to display allowing them to enter the actual
relationship.
I have something that partially works but I will be using this in
several places so I would like to make the code more reusable by
allowing parameters to be sent in for the select field name and the
input field name. Maybe it needs to be a plugin.
I'm a real n00b with jquery so any help is appreciated.
Here's my script. My first thought was that I could at least pass the
name of the otherDiv to the onSelectChange function but I'm not sure
what the syntax is given the way I'm calling it.
<script>
jQuery(document).ready(function(){
    //show:hide relationship other fields on initial page load
    $("select[name='relationship1']").each(onSelectChange);
    //show:hide relationship other fields on select change
    $("select[name='relationship1']").change(onSelectChange);
});
function onSelectChange(){
    var selectedText = this.value != 0 ? $
(this).find(":selected").text() : '' ;
    var isOther = false;
    if(selectedText.indexOf("Other relative") == 0 ||
selectedText.indexOf("Other household member") == 0){
            isOther = true;
        }
    var selectedRow = $(this).attr("currow");
    var otherDiv = $("#OtherSection1_" + selectedRow)[isOther ? "show" :
"hide"]("fast");
    var otherDivInputs = otherDiv.find("input")[isOther ? "addClass" :
"removeClass"]("required");
}
</script>
Here is a sample of the HTML:
<table id="tablesorter-youth" class="tablesorter" border="0"
cellpadding="0" cellspacing="0">
<thead>
    <tr>
        <th class="header headerSortUp">ID</th>
        <th class="header">Name</th>
        <th class="header">Primary Caregiver</th>
        <th class="header">Caregiver 2</th>
    </tr>
</thead>
<tbody>
        <tr>
            <td>100001</td>
            <td>Doe, John</td>
            <td class="nowrap">
                    <select name="relationship1" id="relationship1_1"
class="datainput" currow="1" style="width:170px">
                        <option value="">--SELECT--</option>
                            <option value="100001|1|1">Biological Mother</
option>
                            <option value="100001|2|1">Biological Father</
option>
                            <option value="100001|3|1">Stepparent</option>
                            <option value="100001|4|1">Grandparent</option>
                            <option value="100001|5|1">Adoptive Parent</option>
                            <option value="100001|6|1">Foster Parent</option>
                            <option value="100001|7|1">Other relative </option>
                            <option value="100001|8|1">Other household member </
option>
                    </select>
                    <div id="OtherSection1_1" name="OtherSection1"
style="display:none" class="otherinput">
                        <input type="text" name="OtherText1_1" id="OtherText1_1"
value="" class="datainput otherfield">
                    </div>
            </td>
            <td class="nowrap">
                    <select name="relationship2" id="relationship2_1"
class="datainput" currow="1" style="width:170px">
                        <option value="">--SELECT--</option>
                            <option value="100001|1|1">Biological Mother</option>
                            <option value="100001|2|1">Biological Father</option>
                            <option value="100001|3|1">Stepparent</option>
                            <option value="100001|4|1">Grandparent</option>
                            <option value="100001|5|1">Adoptive Parent</option>
                            <option value="100001|6|1">Foster Parent</option>
                            <option value="100001|7|1">Other relative </option>
                            <option value="100001|8|1">Other household member </option>
                    </select>
                    <div id="OtherSection2_1" name="OtherSection2"
style="display:none" class="otherinput">
                        <input type="text" name="OtherText2_1" id="OtherText2_1"
value="" maxlength="70" class="datainput otherfield" style="width:
150px">
                    </div>
            </td>
        </tr>
        <tr>
            <td>100002</td>
            <td>Smith, Jane</td>
            <td class="nowrap">
                    <select name="relationship1" id="relationship1_2"
class="datainput" currow="2" style="width:170px">
                        <option value="">--SELECT--</option>
                            <option value="100002|1|2">Biological Mother</
option>
                            <option value="100002|2|2">Biological Father</
option>
                            <option value="100002|3|2">Stepparent</option>
                            <option value="100002|4|2">Grandparent</option>
                            <option value="100002|5|2">Adoptive Parent</option>
                            <option value="100002|6|2">Foster Parent</option>
                            <option value="100002|7|2">Other relative </option>
                            <option value="100002|8|2">Other household member </
option>
                    </select>
                    <div id="OtherSection1_2" name="OtherSection1"
style="display:none" class="otherinput">
                        <input type="text" name="OtherText1_2" id="OtherText1_2"
value="" class="datainput otherfield">
                    </div>
            </td>
            <td class="nowrap">
                    <select name="relationship2" id="relationship2_2"
class="datainput" currow="2" style="width:170px">
                        <option value="">--SELECT--</option>
                            <option value="100002|1|2">Biological Mother</option>
                            <option value="100002|2|2">Biological Father</option>
                            <option value="100002|3|2">Stepparent</option>
                            <option value="100002|4|2">Grandparent</option>
                            <option value="100002|5|2">Adoptive Parent</option>
                            <option value="100002|6|2">Foster Parent</option>
                            <option value="100002|7|2">Other relative </option>
                            <option value="100002|8|2">Other household member </option>
                    </select>
                    <div id="OtherSection2_2" name="OtherSection2"
style="display:none" class="otherinput">
                        <input type="text" name="OtherText2_2" id="OtherText2_2"
value="" maxlength="70" class="datainput otherfield" style="width:
150px">
                    </div>
            </td>
        </tr>
</tbody>
</table>