显示隐藏 <DIV> 基于 <SELECT>值

Question

Can anyone help point out to me what's stopping this code that works perfectly fine with jsFiddle from working in my webpage ?

I have been trying to fix this for the past couple of hours, and no matter what I do, I can't seem to get it to trigger. I have a feeling it's going to be something really simple and stupid that's completely gone over my head, but it's slowly ticking me off and hindering progress on other things that rely on this.

I appreciate any help provided, thank you.

$('#select-os').change( function() {
    if (this.value == "r") {
        $('.wont').show();
        $('.ready, .will').hide();
    }
    else if (this.value == "g") {
        $('.will').show();
        $('.ready, .wont').hide();
    }
});

Answer 1

you need a document.ready try this:

$(document).ready(function (){
 $('#select-os').change( function() {
    if (this.value == "r") {
        $('.wont').show();
        $('.ready, .will').hide();
    }
    else if (this.value == "g") {
        $('.will').show();
        $('.ready, .wont').hide();
    }
 });
});