javascript - How to show/hide DIV on selection of ANY drop-down value?

Question

I have found many answers to the question:

How do I show/hide DIV on selection of "Other" dropdown value.

However I cannot find the answer to this: How do I show/hide div on selection of ANY dropdown value, e.g.

<select class="default" id="security_question_1" name="security_question_1">
        <option value="" selected>Select question...</option>
        <option value="1">Question One</option>
        <option value="2">Question Two</option>
        <option value="3">Question Three</option>
        <option value="4">Question Four</option>
        <option value="5">Question Five</option>
        <option value="6">Question Six</option> 
    </select>

I want to be able to show a DIV if any of the above options are selected.

When the user selects 1, 2, 3, 4, 5, or 6 I want to show a DIV. If the user reverts their selection back to "Select question..." this DIV will hide again

A JSfiddle solution would be perfect

Many thanks!

Answer 1

Javascript

var elem = document.getElementById("security_question_1");
elem.onchange = function(){
    var hiddenDiv = document.getElementById("showMe");
    hiddenDiv.style.display = (this.value == "") ? "none":"block";
};

HTML

<select class="default" id="security_question_1" name="security_question_1">
        <option value="" selected>Select question...</option>
        <option value="1">Question One</option>
        <option value="2">Question Two</option>
        <option value="3">Question Three</option>
        <option value="4">Question Four</option>
        <option value="5">Question Five</option>
        <option value="6">Question Six</option> 
    </select>
<div id="showMe">Value Selected</div>

CSS

#showMe{
    display:none;
}

FIDDLE http://jsfiddle.net/Sj5FN/1/