Hi,
I'm trying to implement multiple toggle classes within one ID.
When you toggle 1 class, the intial span 'view details' would hide and
the hidden span 'hide details' would display.
the problem i'm having is i'm unable to specify the text toggling to
happen just to the current class. its happening across all classes.
See code example below...
-----------------------------------------------------------------------------------------------------
<script type="text/javascript">
<!--
$(document).ready(function() {
var showText = "View details";
var hideText = "Hide details";
$(".hide").hide();
$("#award_cat .view").click(function() {
$(".hide").show();
$(".view").hide();
$(this).prev(".more").slideDown("slow");
return false;
});
$("#award_cat .hide").click(function() {
$(".view").show();
$(".hide").hide();
$(".more").slideUp("slow");
return false;
});
});
//-->
</script>
-----------------------------------------------------------------------------------------------------
<body>
<div id="award_cat">
<br />
<div class="more">
blah blah blah<br />
blah blah blah<br />
blah blah blah<br />
</div>
<span class="view">View details</span><span class="hide">Hide
details</span>
<br /><br />
<div class="more">
blah blah blah<br />
blah blah blah<br />
blah blah blah<br />
</div>
<span class="view">View details</span><span class="hide">Hide
details</span>
</div>
</body>
-----------------------------------------------------------------------------------------------------
Any advice/help would be deeply appreciated. :)
