javascript - Why is my jQuery click function not firing? -

i building search page posts itself. got sample page working here. built fiddle here. don't understand why works. when user hits page, should show search form. when search submitted, should hide form, show results, , button new search. i'm using jquery. here's code:

//code block 1 // show search form if there no querystring //hide search form, show  results if querystring $(document).ready(function() { if(document.location.search.length) {     $("#newsearch").show(1000);     $("#results").show(1000);     $("#search").hide(300); } else {     $("#search").show(); } });  //code block 2 //if new search clicked, show form, hide  results       $("#newsearch").click(function() {     $("#newsearch").hide(1000);     $("#results").hide(1000);     $("#search").show(300);  }); 

when code block 1 , 2 loaded in head, block 2 never fires. when pull 2 out , put @ end of page, works.

i trying learn, have 2 questions. (1) why didn't work when 1 block, , (2) suggestions doing better?

thank you.

d

$("#newsearch").click(function() { being run before #newsearch element exists.

therefore click event attached nothing.

it works in first block because it's in $(document).ready, runs code inside after has finished loading.