Search code examples
javascripthtmljqueryjquery-load

populating div from external file div with javascript and jquery

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:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>

<div id="text">
content goes here
</div>

<script type="text/javascript">
    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
    }

</script>

Thanks for any help.

Adam

Edit: Here is a link to the actual file I am working on. There may be something wrong in it as well.

Solution

  • Use this code: $('#text').load(filename + " #source");.