jQuery Checkbox - for multiple time iteration not working

Question

I have a function, that iterate over a table and check some check boxes in a <td> , now this can be performed multiple time where the check boxes to select are different. But my problem is if i perform the step twice in a single instance , then the selection is not working properly, the table is inside a

<div>
<table> </table>
</div>

code for check box

// global
var selectedId  =""


function populate(Id){


if(selectedId != Id){

    selectedId = Id;

    // first uncheck previous selection if any 

    // selective  is the class of check box <td>
    // <td class="selective"><input type="checkbox" name="packId" 
    // value="${pack.packId}"></td>

    $('.selective input:checkbox').each(function () {
      var prevCheckedVal = (this.checked ? $(this).val() :"");
      if(prevCheckedVal != ""){
         $(this).find("input[type=checkbox]").attr("checked", false);
      }
    });

    // now select check boxes for present selection 
    $("tr.allVPClass").each(function() {
       $this = $(this)
       var catId = $this.find("input.IdInVpClass").val();
       if(selectedId == catId){
        $(this).find("input[type=checkbox]").attr("checked", true);
       }
    }); 
}
// open the dialoge
$("#dialog-form").dialog("open");
}

The table is populated in multiple div. if i open seperate div then its working , but not selecting/ checking any check box if i open a same div twice

Answer 1

In order to change the checked status you need to use .prop() instead of .attr()

$(this).find("input[type=checkbox]").prop("checked", false);

Also read this and prop vs attr

Answer 2

You should use .prop() instead of .attr() for checkbox

$(this).find("input[type=checkbox]").prop("checked", true);