Displaying a hidden text box when a particular option value selected

Question

I am trying to make a hidden text-box visible when a particular option value is selected, It works when there are multiple options available obviously because it responds to onChange. How can I get it to work if that is the only option present, the first select box in my Example.

Js Fiddle - http://jsfiddle.net/8bm9R/

This is my Js function

function showOther(fieldObj, otherFieldID) {
    var fieldValue = fieldObj.options[fieldObj.selectedIndex].value;
    var otherFieldObj = document.getElementById(otherFieldID);
    otherFieldObj.style.visibility = (fieldValue == 'other') ? '' : 'hidden';
    return;
} 

Answer 1

I've updated the JsFiddle:

Basically JsFiddle is misused, the function should be set to be wrapped in the header instead of 'onLoad'.

jsfiddle.net/8bm9R/2/

function showOther(fieldObj, otherFieldID)
{

    var fieldValue = fieldObj.options[fieldObj.selectedIndex].value;
    var otherFieldObj = document.getElementById(otherFieldID);

    otherFieldObj.style.visibility = (fieldValue=='other') ? '' : 'hidden';

    return;
}

Cheers

Answer 2

$("select").change(function() {
if($(this).val() == "expected_value") {
otherFieldObj.style.visibility = "visible"
}
else {
otherFieldObj.style.visibility = "hidden"
}
});