Question

I’m creating checkboxes using JQuery as following:

$('<input type="checkbox" ' + 'id=' + (i+1) + '>' + (i+1) + '</input><br/>')

Then later it is removed whenever the user checks the box in:

if (this.checked) {
    $(this).remove();
}

However, The input box is deleted, but the number (id) stays on the page, along the <br/> Tag, so I can see the #i there on the HTML Page.
I would like to remove them as well.
So, to in order to make my question as complete as possible, here is how the HTML is laid:

<input id="1" type="checkbox">
1
<br>

Could someone please give me a clue how to remove #i and <br/> from the page?
Thanks

Answer 1

as stated by other answers – input don’t have closing tags

You will still need to remove all id and <br />. You can find those with .next() function in jquery. You should put your id in <label> or <span>.
Then. for example:

$(this).next('label').remove();
$(this).next('br').remove();
$(this).remove();

Code can be written shorter but it’s for you to see how it works.