動的に作成されたDOM要素

Question

を等しくするための変数を作成し、私は機能に取り組んでいます：

var container  = $('#container'), 
    line1   = $('#line1'), 
    line2   = $('#line2'), 
    line3   = $('#line3'), 
    line4   = $('#line4'), 
    postcode  = $('#postcode'), 
    addressPicker = $('#selector'), 
    noneOfTheAbove = $('#noneOfTheAbove'); 

    $(document).on('click', '#noneOfTheAbove', function() 
    { 
     container.removeClass('hidden'); 

     noneOfTheAbove.addClass('noDisplayElementImportant'); 
     addressPicker.addClass('hidden'); 

     line1.val(''); 
     line2.val(''); 
     line3.val(''); 
     line4.val(''); 
     postcode.val(''); 
    }); 

これで唯一の問題は、DOMを動的にボタンのクリックで作成されますです。したがって、$（document）.ready（）のためにこのような変数を使用することはできません。変数に動的DOM要素を割り当てるにはどうすればよいですか？それは$(document).find('#idHere')のようなものでしょうか？

おかげ

UPDATE 1

作りは（charlietfl答えを使用して）ローカル、グローバルvarsの：彼らは動的であるとして

var container, 
    line1, 
    line2, 
    line3, 
    line4, 
    postcode, 
    addressPicker, 
    noneOfTheAbove; 

$(document).on('click', '#noneOfTheAbove', function() 
{ 
    container  = $('#container'); 
    line1   = $('#line1'); 
    line2   = $('#line2'); 
    line3   = $('#line3'); 
    line4   = $('#line4'); 
    postcode  = $('#postcode'); 
    addressPicker = $('#selector'); 
    noneOfTheAbove = $('#noneOfTheAbove'); 

    container.removeClass('hidden'); 

    noneOfTheAbove.addClass('noDisplayElementImportant'); 
    addressPicker.addClass('hidden'); 

    line1.val(''); 
    line2.val(''); 
    line3.val(''); 
    line4.val(''); 
    postcode.val(''); 
}); 

Answer 1

は、彼らはもちろん

$(document).on('click', '#noneOfTheAbove', function() { 

    var container = $('#container'), 
    line1 = $('#line1'), 
    line2 = $('#line2'), 
    line3 = $('#line3'), 
    line4 = $('#line4'), 
    postcode = $('#postcode'), 
    addressPicker = $('#selector'), 
    noneOfTheAbove = $('#noneOfTheAbove'); 
    container.removeClass('hidden'); 

    noneOfTheAbove.addClass('noDisplayElementImportant'); 
    addressPicker.addClass('hidden'); 

    line1.val(''); 
    line2.val(''); 
    line3.val(''); 
    line4.val(''); 
    postcode.val(''); 
}); 

Answer 2

は、それらを熱心にロードしないでください。あなたがそれらを必要とするときにそれらを使用することを意味する怠惰なローディングで行ってください。

var container, 
    line1,line,.. ; 
    $(document).on('click', '#noneOfTheAbove', function() 
     { 
      container = $('#container'); 
      container.removeClass('hidden'); 

      ... // others 

      ... 
     });