My goal is to assign incrementing index values to button IDs in a loop. For example, if the first button has an ID of 'unique', the second button should have an ID of 'unique0', and the third button should have an ID of 'unique1', and so on. I want to ensure that each button has a unique ID within the loop. Can anyone provide guidance on how to achieve this?
Note: I need button IDs in the format 'unique0', 'unique1', 'unique2', etc.
<!DOCTYPE html>
<html lang="en>
<head>
<title>Bootstrap Example</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="5c3e3333282f282e3d2c1c68726a726d">[email protected]</a>/dist/css/bootstrap.min.css">
<script src="https://cdn.jsdelivr.net/npm/<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="0268737767707b42312c342c32">[email protected]</a>/dist/jquery.slim.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="3b4b544b4b5e491551487b0a150a0d150a">[email protected]</a>/dist/umd/popper.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="54363b3b20272026352414607a627a65">[email protected]</a>/dist/js/bootstrap.bundle.min.js"></script>
</head>
<body>
<div class="container">
<button id="unique" type="button" class="btn btn-primary">Primary</button>
</div>
<script>
$(function() {
var index = $("#unique").index(this);
$("#unique").append(index);
)};
</script>
</body>
</html>