checkbox unique id conflict with script for styling

This is the style I want to achive: http://ift.tt/1I2vAVN

My current checkboxes has same id which is 'level'. There's a script below that identify the id(level) to perform certain task so I cannot have unique id.

However in the checkbox style that I want to achieve, ids are unique for each checkbox.This is being the drawback as it doesn't allow the script to function if the checkbox style achieved.

Now, how to alter the script so that it can allow unique id for checkbox for the purpose of styling as well as to perform that function.

Or is there a way for the script to identify the checkboxes, which id starting with the word 'level' instead of by a fixed id like 'level'? If can, maybe I can use id like 'level_1', 'level_2'....I'm worn out trying this..Exact code would be very helpful.Thanks in advance.

My current HTML for checkboxes

<ul class="box small-block-grid-1 medium-block-grid-2 large-block-grid-2">
                  <li><input type="checkbox" name="level[Primary]" id="level" class="level" value="1"><label>Primary</label></li>
                  <li><input type="checkbox" name="level[Upper Secondary]" id="level" class="level" value="3"><label>Upper Secondary</label></li>
                  <li><input type="checkbox" name="level[University]" id="level" class="level" value="5"><label>University</label></li>
                  <li><input type="checkbox" name="level[Lower Secondary]" id="level" class="level" value="2"><label>Lower Secondary</label></li>
                  <li><input type="checkbox" name="level[Pre University]" id="level" class="level" value="4"><label>Pre University</label></li>
                  <li><input type="checkbox" name="level[Other]" id="level" class="level" value="6"><label>Other</label></li>                 
              </ul>

Script that make use of the id to perform other task

<script>
       $("#slider1").change(function() {
       var value = $(this).val();
       sendtobox(value, $("input[type=checkbox]#level").val());
      });

    $("input[type=checkbox]#level").change(function() {  
     var selectedval = $(this).val();
     if($(this).is(":checked")) {
        var selectedtext = $(this).next().text();
        sendtobox(selectedval, $("#slider1").val());
     }
      else {
        $("th."+selectedval).remove();//controls removing from boxA

     }
    });
</script>