Q:

Upgrade simple show/hide jQuery: show first content + bold nav item

Since I'm at the very beginning of learning jquery, I was hoping that someone could help me solve this: I have a code that hides/shows content when a nav-item is selected. The selected nav-item is also set to be bold.
Now I'd like to upgrade it so that:
a.) the first content (menu_apps) is visible before any nav-item is selected
b.) the corresponding first nav-item (show_apps) is set to bold, so people can see that it is linked to the visible content.
I've been trying to get it to work, but failed every time. Really curious to see the solution. Thanks for your time!
The code: http://jsfiddle.net/KUtY5/489/
JS
 $(document).ready(function(){
    $("#nav a").click(function(){
       $("#nav a").css("font-weight", 400); // First you make them thin
       $(this).css("font-weight", 800); // Than you make them bold
           var id =  $(this).attr('id');
       id = id.split('_');
       $("#menu_container div").hide(); 
       $("#menu_container #menu_"+id[1]).show();
    });
});

CSS
#menu_container {
 width: 650px;
 height: auto;
 padding-left: 30px;
}
#menu_container div {
 display:none;
}

HTML
<div id='nav'>
    <a id="show_apps">Appetizers</a> | <a id="show_soups">Soups and Salads</a> | <a id="show_entrees">Entrees</a>
</div>

<div id="menu_container">
    <div id="menu_apps">
    Content of the App Section Here
    </div>
    <div id="menu_soups">
    Content of the Soups Section Here
    </div>
    <div id="menu_entrees">
    Content of the Entrees Section Here
    </div>
</div>

A:

Here I have updated your code little bit check it out 
http://jsfiddle.net/KUtY5/493/
I have added these lines on your document ready
$("#menu_apps").show();
$("#show_apps").css("font-weight", 400); // First you make them thin
$('#show_apps').css("font-weight", 800);

