dimanche 11 février 2018

How to add ID and label tag to checkbox with jquery

I have the following HTML code (that I can't access/amend) for one of my many checkboxes:

<input type="checkbox" class="cat_input" name="subcategory1a" value="1">

I want to turn the checkbox into a toggle, for which I undersand I need a <label> tag associated with the 'ID' of the checkbox. Unfortunately, the HTML code as per above has only the input tag without ID and no <label> tag.

To create a checkbox toggle I understand I would need a unique ID and associated <label> tag for each checkbox such as for example:

 <input type="checkbox" class="cat_input" name="subcategory1a" value="1" ID="checkbox1"> <label for="checkbox1"></label>

I have two questions:

  • How can I add the ID and <label> tag with jquerry to my existing <input> tag to create a code as per the example?
  • Given that I have c. 40-50 checkboxes of which each needs its own ID and label tag, is there a way to make the jquery code compact as opposed to copy paste the code 40-50x?

I would much appreciate your help!!

Thank you very much in advance!!




Aucun commentaire:

Enregistrer un commentaire