javascript - Changing aria-control attribute value in Cloned fields -

i've altered code given milan jaric question jquery clone form fields , increment id i'm coming across issue i'm trying clone bootstrap collapse. can't see figure out how alter attribute 'aria-control' value.

here's the demo of have. id , href work fine themselves, moment try change 'aria-control' value, of ids , hrefs in bootstrap collapse not change default values. ideas?

js script

var regex = /^(.*)(\d)+$/i; var cloneindex = $(".clonedbox").length;  function clone() {     $(this).parents(".clonedbox").clone()         .appendto("div#accession_boxes")         .attr("id", "clonedbox" + cloneindex)         .find("*")         .each(function () {             var id = this.id || "";             var match = id.match(regex) || [];              if (match.length == 3) {                 this.id = match[1] + (cloneindex);                 this.href = match[1] + (cloneindex);                 this.attr("a[aria-controls]") = match[1] + cloneindex;             }         })         .on('click', '#btnaddbox', clone)         .on('click', '#btndelbox', remove);     cloneindex++; } function remove() {     $(this).parents(".clonedbox").remove(); } $("#btnaddbox").on("click", clone);  $("#btndelbox").on("click", remove); 

and yes, know remove buttons not work, it's not priority right now.

edit:

thanks lmgonzalves, js script works. below updated script. thank again of help!

js script (updated)

    var regex = /^(.*)(\d)+$/i; var cloneindex = $(".clonedbox").length;  function clone() {     $(this).parents(".clonedbox").clone()         .appendto("div#accession_boxes")         .attr("id", "clonedbox" + cloneindex)         .find("*")         .each(function () {             var id = this.id || "";             var href = this.href || "";             var aria = $(this).attr("aria-controls") || "";              var matchid = id.match(regex) || [];             var matchhref = href.match(regex) || [];             var matcharia = aria.match(regex) || [];              if (matchid.length == 3) {                 this.id = matchid[1] + (cloneindex);                 this.href = matchhref[1] + (cloneindex);                 this.aria = matcharia[1] + (cloneindex);             }         })         .on('click', '#btnaddbox', clone)         .on('click', '#btndelbox', remove);     cloneindex++; } function remove() {     $(this).parents(".clonedbox").remove(); } $("#btnaddbox").on("click", clone);  $("#btndelbox").on("click", remove); 

to set attribute using attr() need syntax:

$(element).attr("name", value); 

so in code use:

$(this).attr("aria-controls", match[1] + cloneindex); 

instead:

this.attr("a[aria-controls]") = match[1] + cloneindex; 

note need "wrap" $() this convert jquery object , allow use attr() , others jquery functions.

demo here