I see this question asked a lot in the related questions, but my need seems very simple compared to those examples, and sadly I'm just still too new at js to know what to remove...so at the risk of being THAT GUY, I'm going to ask my question...

I'm trying to switch out the div contents in a box depending on the button pushed. Right now I have it working using the animatedcollapse.toggle function, but it doesn't look very good. I want to replace it with a basic fade in on click and fade in new content on next button.

Basic idea:

<div>
<ul>
<li><a href="this will fade in the first_div"></li>
<li><a href="this will fade in the second_div"></li>
<li><a href="this will fade in the third_div"></li>
</ul>
<div class="first_container">
 <ul>
  <li>stuff</li>
  <li>stuff</li>
  <li>stuff</li>
 </ul>
</div>
<div class="second_container">
 <ul>
  <li>stuff</li>
  <li>stuff</li>
  <li>stuff</li>
 </ul>
</div>
<div class="third_container">
 <ul>
  <li>stuff</li>
  <li>stuff</li>
  <li>stuff</li>
 </ul>
</div>
</div>

I've got everything working with the animated collapse, but it's just an ugly effect for this situation, so I want to change it out.

Thanks! Joel