Replace default content in div with detailed content

Ok I got it using two files instead of one. So by default I load the text content for this page and when I click one of the links I load the menu.php with the right category_id


<div class="sidebar">
  <ul id="menu">
    <li><a href='menu.php?category_id=1'>Soepen/Soups</a></li>
    <li><a href='menu.php?category_id=2'>Voorgerechten/Appetizers</a></li>
    <li><a href='menu.php?category_id=3'>Hoofdgerechten/Main Courses</a></li>
    <li><a href='menu.php?category_id=4'>Menu's/Menus</a></li>
    <li><a href='menu.php?category_id=5'>Bijgerechten/Side Dishes</a></li>	
  </ul>
</div>

and for the load function as before:


$(document).ready(function(){
	$(".content").load( "modules/site/content.php" );	
  $("#menu").on("click", "a", function(e) {
    e.preventDefault();
    $(".content").load(this.href); 	
  });
});

:

It is probably possible with two queries in one file but I am happy with the result :slight_smile: