[jQuery] resolve my conflict

[jQuery] resolve my conflict


hi guys,
always got a great response here, so before i turn to the lightbox
community i'm posting here in the hope of an answer :) got a site up
i've been working on for a client: http://www.ldexterldesign.co.uk/lippyMagazine/latestIssue.html
i have two js functions on every page (posted below). basically both
of them work independently, but when i put them in the header together
there are conflicts - usually whichever function comes last in the
header works.
help would be most impressive!
lewis
<!-- jquery article hide/reveal script -->
<script type="text/javascript" src="scripts/jquery/jquery-1.2.3.js"></
script>
<script type="text/javascript">
$(document).ready(function() {
$(".articleBody").addClass("collapsed"); $(".articleReveal
a").click(function() {
$
(this).parents("div.articleItem").find(".articleBody").removeClass("collapsed");
return false; }
); $(".articleCollapse a").click(function() {
$
(this).parents("div.articleItem").find(".articleBody").addClass("collapsed");
return false; }
); }
);
</script>
<style type="text/css">
.collapsed {
    height: 3.5em;
    overflow:hidden;
}
</style>
<!-- lightbox functionality -->
<script type="text/javascript" src="js/prototype.js"></script>
<script type="text/javascript" src="js/scriptaculous.js?
load=effects"></script>
<script type="text/javascript" src="js/lightbox.js"></script>
<link rel="stylesheet" href="css/lightbox.css" type="text/css"
media="screen" />