but with this code all checkbox elements have the same id...

var count;
var length = $('input[type=checkbox]').length
for(count=1;count<=length;count++){
    $('input[type=checkbox]').attr('id',count)
}

but with this code all checkbox elements have the same id...

var count;
var length = $('input[type=checkbox]').length
for(count=1;count<=length;count++){
    $('input[type=checkbox]').attr('id',count)
}

• javascript
• jquery

Share Improve this question Follow edited Oct 22, 2015 at 23:21 Roko C. Buljan 207k4141 gold badges328328 silver badges340340 bronze badges asked May 4, 2013 at 15:29 pouyapouya 4311 silver badge99 bronze badges

Add a ment  | 

5 Answers 5

Sorted by: Reset to default 4

Set elements ID using .prop() or .attr()

$(':checkbox').prop("id", function( i ){
    return i;
});

jsBin demo

Set elements ID using .each()

$(':checkbox').each(function( i ){
    this.id = i;
});

jsBin demo

Both examples return:

<input id="0" type="checkbox">
<input id="1" type="checkbox">
<input id="2" type="checkbox">
<input id="3" type="checkbox">

if you want to start from 1 just use:

this.id = i+1;

Since numerical ID is not supported in non HTML5 (older) browsers, add any string prefix to the ID number like "el"+ (i+1)

$('input[type=checkbox]').prop('id', function(i) {
     return ++i;
});

Use each() to iterate through elements returned by selector and assign ids. Numeric id is generally not considered a good practice you prefix of postfix with some string.

 $('input[type=checkbox]').each(function(i){
   $(this).attr('id',"id_"+i)
 })

Use .each() instead:

$('input[type=checkbox]').each(function(i) {
    // i is the 0-based index of this element in the matched set
    $(this).prop('id', i); 
});

use this:

$(document).ready(function() {
   var count = 1;
   $("input[type='checkbox']").each(function(index,domobj) {
      $(domobj).prop("id",count++);
   });
});

use .prop() when your jquery is 1.6+
use .attr() when your jquery is 1.6-