hi everyone... not sure if this belongs here or in the javascript section as it uses both js and php? move it if needed.
anyway....i have a script that pulls the faq results from my database and shows them in order of categorie. what im trying to do is use js to expand and hide the faq when the categorie name is selected.
i have some code but its only expanding the first categorie section no matter what name i click. ....how the code is written it outputs each categorie section as an id named "menu". so im sure the js is only taking into account the first "menu id" it comes to.
heres the code....
<!--FAQ ALL LINKS-->
<div id="selFAQLinks" class="clsMarginTop">
<h3><span class="clsCategory"><?php echo $this->lang->line('View FAQ');?></span></h3>
<ul>
<?php
if(isset($FaqCategoriesWithFaqs) and count($FaqCategoriesWithFaqs)>0 )
{
foreach($FaqCategoriesWithFaqs as $FaqCategoriesWithFaq)
{
if($FaqCategoriesWithFaq['num_faqs']>0)
{
?>
<li><b><a href="#" onclick="javascript:switchit('menu')"><?php echo $FaqCategoriesWithFaq['faq_category_name']?></a></b>
<ul id="menu">
<?php
foreach($FaqCategoriesWithFaq['faqs']->result() as $faq)
{
?>
<li> <a href="<?php echo site_url('faq/view/'.$faq->id); ?>"><?php echo $faq->question; ?></a></li>
<?php
} //Foreach End - Traverse Category
?>
</ul>
</li>
<?php
}//Check For Faq Availability
} //For Each Travesal - For Faq
}//If End - Check For Faq Existence
?>
</ul>
</div>
<!--END OF FAQ ALL LINKS-->
</div>
</div>
heres the js
function switchit(list){
var listElementStyle=document.getElementById(list).style;
if (listElementStyle.display=="none"){
listElementStyle.display="block";
}
else {
listElementStyle.display="none";
}
}
any help is appreciated
thanks