How to insert element inside another dynamically created

Question

When I load the page, I have some checkbox:

<input type="checkbox">

And when I get to the ready of the page, I want to put the checkbox inside a label with class 'checkboxPersonalized', being as follows:

<label class="checkboxPersonalizada">
     <input type="checkbox">
     <i></i>
</label>

Answer 1

It was not very clear your question. But it would be something like?

	$(document).ready(function() {
	  var conteudo = $(".checkboxPersonalizada").html();
	  var check = "<input type='checkbox'>";
	  $(".checkboxPersonalizada").html(conteudo + check)
	});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<label class="checkboxPersonalizada">
  oi
  <i></i>
</label>

Answer 2

I believe I can use the jquery wrap to achieve what you want from the string shape.

$(document).ready(function(){
  var checkboxElment = $('#checkboxWrapped');
  var wrapper        = $('<label/>').addClass('checkboxPersonalizada').text();
  var extraElem      = $('<i/>').text();

  checkboxElment.wrap( wrapper ).parent().append( extraElem );
});

link: http://codepen.io/anon/pen/pRyRJR

I left the text property if you want to add something.