how to check/uncheck only specific checkbox if there are multiple checkboxes

Question

<div style="height: 237px; margin-top: 5px; overflow-y: scroll;width:230px;" id="divContainer">
    <input type="checkbox" value="anxyzkur@xyz.com" class="ads_Checkbox" name="chk_[18510][email]" checked="" id="chk_">   
   <label style="position: relative;vertical-align:text-bottom;" for="chk_">item 25</label>
    <p style="padding-left:25px;margin-top:0;width:170px;" id="address">Ahmedabad</p>

    <input type="checkbox" value="abc@abc.com" class="ads_Checkbox" name="chk_[18549][email]" checked="" id="chk_">
     <label style="position: relative;vertical-align:text-bottom;" for="chk_">item3</label>
      <p style="padding-left:25px;margin-top:0;width:170px;" id="address">ahmedabad</p></div>

http://jsfiddle.net/Urvisha123/ZCTNe/ please see this fiddle .

I have problem that when i click on second label checkboxes.then first checkbox is check/unchecking.

i dont want this .

Answer 1

There were same id for both checkboxes and label attribute "for" Change these

<input type="checkbox" value="abc@abc.com" class="ads_Checkbox" name="chk_[18549][email]" checked="" id="chk_"><label style="position: relative;vertical-align:text-bottom;" for="chk_">item3</label>

To

<input type="checkbox" value="abc@abc.com" class="ads_Checkbox" name="chk_[18549][email]" checked="" id="chk__"><label style="position: relative;vertical-align:text-bottom;" for="chk__">item3</label>

If you are building these dynamically then it should be like this for example

<?php

for( $i=0; $i < 10 ; $i++)
{
?>
<input type="checkbox" value="abc@abc.com" class="ads_Checkbox" name="chk_[18549][email]" checked="" id="<?php echo 'chk_'.$i;?>">
<label style="position: relative;vertical-align:text-bottom;" for="<?php echo 'chk_'.$i;?>">item3</label>

<?php
}
?>