javascript checkbox checkd but not updating UI

I wrote a script to check checkbox when I am clicking on it's respective image. Image have id like checkbox-img-1 and checkbox input have id like checkbox-1 for 1st pair of checkbox and image. For 2nd pair id's are checkbox-img-2 and checkbox-2 and so on. So, whenever I click on image I want to check the respective checkbox. For few images the UI is getting updated but for few images it's not getting updated. What is the possible problem? I searched a bit but all questions were doing mistake of having attr in place of prop. My script is in pure javascript. I tried with jQuery but I am getting same bug. The javascript code is:

/* Check option on image click */
        $(".option-check-img").click(function () {
            var checkbox_img_id = $(this).attr("id");
            var checkbox_id     = checkbox_img_id.replace("checkbox-img", "checkbox");
            if(document.getElementById(checkbox_id).checked)
            {
                document.getElementById(checkbox_id).checked = false;
                var d = document.getElementById(checkbox_img_id);
                d.className = "img-circle pointer";
                /*$("#checkbox_id").prop("checked", false);
                $("#checkbox_img_id").removeClass("img-border");
                console.log(document.getElementById(checkbox_id));*/
            }
            else
            {
                document.getElementById(checkbox_id).checked = true;
                var d = document.getElementById(checkbox_img_id);
                d.className += " img-border";
                /*$("#checkbox_id").prop("checked", true);
                $("#checkbox_img_id").addClass("img-border");
                console.log(document.getElementById(checkbox_id));*/
            }
        });

Any solution? Thank you.