How to assign unique id for bootstrap checkbox badges?

I am working on a admin page where you can list all the users. In a table you can see each user permissions.

I want to use a checkbox that automatically updates the database column value either to true or false by using ajax (according to a given permission represented by a badge checkbox).

I have found this badge checkbox. And the jsfiddle is here.

However, there is a problem. When there is more than one row, the checkbox functionality does not work anymore. Moreover, if you change the default id of any badge, this does not work any longer as shown now in this fiddle.

How can I make these badges work for several rows and with their own IDs?

For example, I want to assign id="user-{{id}}-permissionName" instead of id="success" for all the rows.