title: populating div from external file div with javascript and jquery
body: <p>Very frustrated here. Can't get this to work and don't know why.
  I am trying to populate my div with a div from another html file. Here is my code:</p>
  
  <pre><code>&lt;script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"&gt;&lt;/script&gt;
  
  &lt;div id="text"&gt;
  content goes here
  &lt;/div&gt;
  
  &lt;script type="text/javascript"&gt;
      function whenButtonClicked() {
          var book = document.getElementById("book").value; //this is working
          var chapter = document.getElementById("chapter").value; //this is working
          var filename = 'files/' + book + chapter + '.html'; //this is working
          $('#text').load(filename #source); //this is NOT
      }
  
  &lt;/script&gt;
  </code></pre>
  
  <p>Thanks for any help.</p>
  
  <p>Adam</p>
  
  <p>Edit: Here is a <a href="http://dl.dropbox.com/u/8899944/files/kh-bible.html" rel="nofollow">link</a> to the actual file I am working on. There may be something wrong in it as well.</p>