添加document.ready时代码不起作用

Question

the code below works fine on jsFiddle without $(document).ready(function() { and the closing brackets. (ex: http://jsfiddle.net/cEDYD/ ) but soon as I put the code on my webpage with the document ready it stops works. Am I missing something? I've included jquery

<script type="text/javascript">
$(document).ready(function() {
    function showDiv(element, pro2) {
        if (pro2.children("option:selected").val() == "cpl") element.show();
        else element.hide();
    }

    var myElement = $("div#pro2");
    var mypro2 = $("select#ptype");

    $("select").change(function() {
        showDiv(myElement, mypro2)
    });
});
</script>

Answer 1

Is there a reason you wouldn't want this wrapped in a document ready handler?

Appears the DOM is not ready at the time your javascript is executing.

Check the javascript console. Google Chrome is excellent for JS debugging.

Answer 2

problem ended up being a mistype character in my css file. -thanks for the testing guys

Answer 3

Your jsfiddle has a setting that automatically wraps the code in document.ready() . That's why it works without the ready() in the jsFiddle (see where is says onload in the upper left panel).

document.ready() is needed in a regular web page unless you place the javascript after the body HTML.