<td id="optrep0">
  <input type="checkbox" value="1" class="warna" id="warna" name="warna[]"> 
  <input type="checkbox" value="2" class="warna" id="warna" name="warna[]">
  </td>
<td id="optrep1">
  <input type="checkbox" value="1" class="warna" id="warna" name="warna[]"> 
  <input type="checkbox" value="2" class="warna" id="warna" name="warna[]">
  </td>
<td id="optrep2">
  <input type="checkbox" value="1" class="warna" id="warna" name="warna[]"> 
  <input type="checkbox" value="2" class="warna" id="warna" name="warna[]">
  </td>

I need to find checked value of specified divs having ids: optrep0,optrep1,optrep2 above, I have tried using

var optrep0= jQuery(':checkbox:checked').map(function () {
    return this.value;
}).get();

And send optrep0 variable to server, but it will send every checked value. So, I want to send only specified divs only per variable, I also tried

 var optrep0= jQuery('#optrep0>#warna:checkbox:checked').map(function () {
     return this.value;
 }).get();

PS: sub id name on td id cannot be changed as is as, I only need javascript example how to solve this case, thank you :D

<td id="optrep0">
  <input type="checkbox" value="1" class="warna" id="warna" name="warna[]"> 
  <input type="checkbox" value="2" class="warna" id="warna" name="warna[]">
  </td>
<td id="optrep1">
  <input type="checkbox" value="1" class="warna" id="warna" name="warna[]"> 
  <input type="checkbox" value="2" class="warna" id="warna" name="warna[]">
  </td>
<td id="optrep2">
  <input type="checkbox" value="1" class="warna" id="warna" name="warna[]"> 
  <input type="checkbox" value="2" class="warna" id="warna" name="warna[]">
  </td>

I need to find checked value of specified divs having ids: optrep0,optrep1,optrep2 above, I have tried using

var optrep0= jQuery(':checkbox:checked').map(function () {
    return this.value;
}).get();

And send optrep0 variable to server, but it will send every checked value. So, I want to send only specified divs only per variable, I also tried

 var optrep0= jQuery('#optrep0>#warna:checkbox:checked').map(function () {
     return this.value;
 }).get();

PS: sub id name on td id cannot be changed as is as, I only need javascript example how to solve this case, thank you :D

• javascript
• php
• jquery
• html
• css

• 3 Why you have same id? – Radonirina Maminiaina Commented Jun 2, 2015 at 7:52
• Yes. because server fixed send same id for the selector, I cannot change the name thought, but I can only create parent id to make the option unique – Reids Meke Meke Commented Jun 2, 2015 at 8:00
• So generate a different id, for example: warna1, warna2, or use timestamp. :) – Radonirina Maminiaina Commented Jun 2, 2015 at 8:02
• As I said before, sub id name "warna" cannot change, it should be used as is as due server issue, just need to find how to solve this case – Reids Meke Meke Commented Jun 2, 2015 at 8:04
• Yeah, name cannot be changed, but if input is generated into a loop, it's easy to do it, or use javascript to do this! ;) – Radonirina Maminiaina Commented Jun 2, 2015 at 8:07

3 Answers 3

Give space in > and use dot for class warna

Live Demo

var optrep0= jQuery('#optrep0 > .warna:checkbox:checked').map(function () {
    return this.value;
}).get();

Try using descendant selector by putting a > and don't use :checkbox, only :checked is needed

var optrep0= jQuery('#optrep0 > :checked').map(function () {
 return this.value;
 }).get();

I would say the preferable way is

var optrep0= jQuery('#optrep0 > .warna:checkbox:checked').map(function () {
    return this.value;
}).get();

DEMO