jQuery addClass example

Change class name on click in jQuery

by Dmitri Ganenco

HTML

<link rel="stylesheet" href="https://gitcdn.github.io/bootstrap-toggle/2.2.2/css/bootstrap-toggle.min.css">
<script src="https://gitcdn.github.io/bootstrap-toggle/2.2.2/js/bootstrap-toggle.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.3.1/js/bootstrap.min.js"></script>
<!-- <div class="insurance-check-form"></div>
<button class=" btn btn-link " id="add-more">asd
	<i class="fas fa-plus head2 p-1 border round"></i>
</button> -->

<input type="checkbox" checked data-toggle="toggle" data-onstyle="success">

JavaScript

var max_fields = 5;
 var field_wrapper = $(".insurance-check-form");
 var add_button = $("#add-more");
 var ins_company_count = 1;

 $(document).on("click", "#add-more", (function(e) {
debugger;
	let checkBox = $('<input>', {
		type: 'checkbox',
		'data-toggle': 'toggle'
	});
	field_wrapper.append(checkBox);
   /* e.preventDefault();
   if (ins_company_count < max_fields) {
     $(field_wrapper).append('<div class="row mt-5"> <div class="col-md-2"> <select name="insurance" class="custom-select"> <option selected>Custom Select Menu</option> <option value="volvo">ICCI Prudential</option> <option value="fiat">Blue Star</option> <option value="audi">Edelwiss Tokyo</option> </select> </div><div class="col-md-3"> <input type="checkbox" data-toggle="toggle" data-style="slow" data-width="250" data-height="35" data-on="Click to Unsubmit" data-off="Click to Submit" data-onstyle="primary" data-offstyle="secondary" id="clearance-check"><br><span class="head3" data-toggle="popover" data-trigger="hover" data-content="Click here to add a notes"> <button class="btn btn-link" data-toggle="modal" data-target="#igl-sub-modal" data-backdrop="static" data-keyboard="false"> <i class="far fa-file-alt head3 text-gray"></i></button> </div><div class="col-md-3"> <input type="checkbox" data-toggle="toggle" data-style="slow" data-width="250" data-height="35" data-on="Click to Unsubmit" data-off="Click to Submit" data-onstyle="primary" data-offstyle="secondary" id="clearance-check"><br><span class="head3" data-toggle="popover" data-trigger="hover" data-content="Click here to add a notes"> <button class="btn btn-link" data-toggle="modal" data-target="#igl-sub-modal" data-backdrop="static" data-keyboard="false"> <i class="far fa-file-alt head3 text-gray"></i></button> </div><div class="col-md-3"> <input type="checkbox" data-toggle="toggle" data-style="slow" data-width="250" data-height="35" data-on="Click to Unsubmit" data-off="Click to Submit" data-onstyle="primary" data-offstyle="secondary"...