Code works in fiddle, but not on webpage

Question

Have tried and tested code in fiddle, the aim is to hide second column when there is a 1 in the dropdown at the top, this works on fiddle, but nothing changes on webpage. Any ideas.

Testing webpage is on a live site, located here: http://www.specialfinance.co.uk/introducers/submit-an-enquiry/secured-loans2.html

fiddle is located here: http://jsfiddle.net/FFJbY/6/ – sagamon Mar 13 '13 at 12:33 — sagamon, Mar 13 '13 at 12:33

Fabrício Matté · Accepted Answer · 2013-03-13T12:43:09.677

Your jQuery code is executing before the elements are in the DOM. Wrap it inside a DOM Ready handler to fix that:

$(function() {
    //your code here
    $("#selectList").change(function() {
        if ($(this).val() == "1") {
           $(".showMe").hide();
        }
        else {
            $(".showMe").show();
        }
    });
});

Your fiddle has an onLoad wrapper (top-left of the page) which automatically wraps your code inside an window.onload function.

window.onload works too but it takes considerably longer than a DOM ready handler to kick in when you have a large page with images and other resources.

score 0 · Answer 2 · answered Mar 13 '13 at 12:36

Enclose your jquery in a document.ready() handler, like so:

$(document).ready(function() {
   $("#selectList").change(function() {
       if ($(this).val() == "1") {
          $(".showMe").hide();
       }
       else {
           $(".showMe").show();
       }
   });
});

Code works in fiddle, but not on webpage

2 Answers2

Linked

Related