How can i load 2 link in different tag with jquery

when click on the these links show first click in result 1 then click on second link show in result 2

<ul>
  <li><a href="link1.html">Link 1</a></li>
  <li><a href="link2.html">Link 2</a></li>
  <li><a href="link3.html">Link 3</a></li>
  <li><a href="link4.html">Link 4</a></li>
</ul>

<div id="result_1"></div>
<div id="result_2"></div>

Example (user click on link 1 then click on link 2) :

<ul>
  <li><a class="result_1" href="link1.html">Link 1</a></li>
  <li><a href="link2.html">Link 2</a></li>
  <li><a class="result_2" href="link3.html">Link 3</a></li>
  <li><a href="link4.html">Link 4</a></li>
</ul>

<div id="result_1">link1.hmtl</div>
<div id="result_2">link3.html</div>

then after click to other links remove the class and content

<ul>
  <li><a开发者_高级运维 href="link1.html">Link 1</a></li>
  <li><a href="link2.html">Link 2</a></li>
  <li><a class="result_2" href="link3.html">Link 3</a></li>
  <li><a class="result_1" href="link4.html">Link 4</a></li>
</ul>

<div id="result_1">link4.hmtl</div>
<div id="result_2">link3.html</div>

i want do this with .load()

sorry for my bad English

---

var firstDiv = $("#result_1");
var secondDiv = $("#result_2");
$("a").toggle(function(){
     secondDiv.hide();
     secondDiv.load($(this).attr("href")).show();
   },function() {
     firstDiv.hide();
     secondDiv.load($(this).attr("href")).show();
  });