jQuery toggle on a PHP foreach statement

The code for the page is the following

<?php foreach ($organization->index() as $id=>$content) { ?>
<a href="#" id="obtain_branch"><?= $content->name?></a>
<div id="directory_brnach"><?= $content->about?></div>
<?php } ?>

The JavaScript code using jQuery is

 // Directory inner branches
$('#obtain_branch').click(function(){
   $('#directory_brnach').toggle('fast');
});

The problem it will only work on the first one given the the ID is not changing, the rest will not change.

How can I send an array to the jQuery function to give an individual ID on every iteration?

Thanks in advance.

Answers


The #obtain_branch selects the first element with that ID. Using a class will help for the links, but not for the divs - that will toggle them all at once. Try:

<?php foreach ($organization->index() as $id=>$content) { ?>
<a href="#" class="obtain_branch"><?= $content->name?></a>
<div class="directory_brnach"><?= $content->about?></div>
<?php } ?>

JavaScript:

$('.obtain_branch').click(function(){
    $(this).next('.directory_brnach').toggle('fast');
    return false; //to avoid the link from working
});

IDs need to be unique. Try:

<?php foreach ($organization->index() as $id=>$content) { ?>
<a href="#" class="obtain_branch"><?= $content->name?></a>
<div><?= $content->about?></div>
<?php } ?>

with:

$('a.obtain_branch').click(function(){
   $(this).next().toggle('fast');
   return false;
});

Need Your Help

Open Facebook native app from your android app

android facebook url-scheme

My question is directly connected with this one Open Facebook page from Android app? Which answer (for the version at the moment) is not the marked one but this one