I know close to nothing about jQuery, but I swear I'm trying to learn. The thing is, I've got some code that works, but I know it's repetitive and probably not kosher for a real programmer, which is why I've turned to you all.
What I want to do is show/hide (or toggle, whatever you think is best) some informational divs, or so you might call them, on this page.
The show/hide code that I have right now stands at this:
$(document).ready(function(){
$('#meet_growlab, #buddy_tv').hide();
$('a#growlab').click(function(){
$('#meet_growlab').show('slow');
});
$('a#growlab_close').click(function(){
$('#meet_growlab').hide('slow');
})
$('a#buddytv').click(function(){
$('#buddy_tv').show('slow');
});
$('a#buddytv_close').click(function(){
$('#buddy_tv').hide('slow');
})
});
With the HTML being:
<div id="meet_growlab">BLAH BLAH BLAH
<p><a href="#" id="growlab_close">Close</a></p>
</div>
<div id="buddy_tv">BLAH BLAH BLAH
<p><a href="#" id="buddytv_close">Close</a></p>
</div>
<ul>
<li><a href="#" id="growlab" rel="#meet_growlab">Meet GrowLab - Canada’s Y-Combinator Arrives in Vancouver (June 24, 2011)</a></li>
<li><a href="#" id="buddytv" rel="#buddy_tv">Building the Web's Best Entertainment-Based Community Site: Andy Liu, CEO and Founder of BuddyTV (April 1, 2011)</a></li>
</ul>
It works, but it's not pretty.