$(document).on("click", ".input-checkbox", function () { var $this = $(this); if ($this.is(":checked")) { $this.parent().addClass("selected"); } else { $this.parent().removeClass("selected"); } }); function getNewLineItem(inputText) { return '<div class="input-group">' + '<span class="input-group-addon">' + '<input class="input-checkbox" type="checkbox" >' + '</span>' + '<input class="input-check form-control" type="text" value="' + inputText + '">' + '<span class="input-remove input-group-addon">' + '<a href="#">X</a>' + '</span>' + '</div>'; }
  • one
    Hmm, what is "embedded text"? And what does "now" mean? Previously, some kind of background was? What do you need? - user207618

1 answer 1

It is quite difficult to understand from this description, but is it necessary?

 $(function(){ // По клику добавляем одно getNewLineItem() с случайным числом $('#addNewEntry').on('click', e => $('#wrapper').append(getNewLineItem(Math.random()))); // $('#wrapper').on("click", ".input-checkbox", function () { var $this = $(this); if ($this.is(":checked")) { // Если отмечен // Добавляем класс предку $this.parent().addClass("selected"); // Ищем текстовое поле и выделяем его содержимое $this.parent().parent().find('.form-control').get(0).select(); }else{ $this.parent().removeClass("selected"); } }); }); function getNewLineItem(inputText){ return '<div class="input-group">' + '<span class="input-group-addon">' + '<input class="input-checkbox" type="checkbox" >' + '</span>' + '<input class="input-check form-control" type="text" value="' + inputText + '">' + '<span class="input-remove input-group-addon">' + '<a href="#">X</a>' + '</span>' + '</div>'; } 
 <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"/> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div id='wrapper'></div> <hr /> <input type='button' id='addNewEntry' value='Add new entry' />