Untitled

Click link, show information in another section
<ul>
   <li> Dog 1 </li>
   <li> Dog 2 </li>
</ul>

<div class="dog-info">
   <div>
   <h2> Dog 1 </h2>
   <p> blah blah </p>
</div>

<ul id="dogs">
  <li>Beagle</li>
  <li>Lab</li>
</ul>

<div id="dogInfo">

</div>

$(function () {
  $('ul#dogs li').click(function () {
    $("#dogInfo").html("More info about " + $(this).text() + " goes here");
  });
});

<a id="dog1" href="dog1.html">dog1</a> <div> About Dog 1 </div><br>
<a id="dog2" href="dog2.html">dog2</a> <div> About Dog 2 </div><br>
<a id="dog3" href="dog3.html">dog3</a> <div> About Dog 3 </div><br>
<a id="dog4" href="dog4.html">dog4</a> <div> About Dog 4 </div><br>

$(function() {
    $('a ~ div').hide();
    $('a').click(function() {
        $('a ~ div').hide();
        $(this).next().show();
        return false;
    });
});