Loading external HTML into multiple divs

Loading external HTML into multiple divs

Ok lets see if i can explain this... I am trying to get content to load in to a div (working) but at the same time i need it to overwrite another div so lets make this in to a tree

HEADER > MENU > CONTENT

<div id="MENU"> [HOME] | About Us | Contact Us </div>

<div id="CONTENT" > BLAH BLAH BLAH </div>

So so now HOME is highlighted example [ ] and content is full of index.html content when i click on lets say About us i want it to change the content of CONTENT and MENU i have it working so that content changes

    <div id="MENU"> Home | [ABOUT US] | Contact Us </div>

    <div id="CONTENT" > WHO WHO WHO </div>


more or less i created an external html load that grabs the content and tosses it in to the CONTENT div but i want to add multiple divs inside the external HTML so i can tell the jquery to grab contents from <div id="MENU2"> and Place it in <div id="MENU"> overwriting whats in <div id="MENU"> already so that the new Active link is shown as well as grab contents from <div id="CONTENT2"> and place it in <div id="CONTENT"> overwriting whats there this is what i have for the code so far.



<script type="text/javascript">
    function loadabout() {
      $('#content').load("about.html");
    }
    </script>


And this

    <div id="menu">
<ul id="links">
    <li><a id="active" href="index.html"><span id="t">Home</span></a></li>
    <li><a href="#" onclick="loadabout()"/>About Us</a></li>
    <li><a href="#">Contact Us</a></li>
</ul>
</div>

<div id="content">
Blah
</div>
    • Topic Participants

    • john