There is no difference between .append() and .appendTo() functions except the syntax:
<script>
$('.target').append('text');
$('text').appendTo('.target');
</script> |
<script>
$('.target').append('text');
$('text').appendTo('.target');
</script>
But they both needed because of chaining and code readability:
<script>
$(function(){
$('.target').append('<div class="element well">.element</div>')
.css('background-color', 'yellow'); // yellow collor added to .target
$('<div class="element2 well">.element2</div>').appendTo('.target2')
.css('background-color', 'yellow'); // yellow collor added to .element2
});
</script> |
<script>
$(function(){
$('.target').append('<div class="element well">.element</div>')
.css('background-color', 'yellow'); // yellow collor added to .target
$('<div class="element2 well">.element2</div>').appendTo('.target2')
.css('background-color', 'yellow'); // yellow collor added to .element2
});
</script>
<div class="well target">
<span class="label label-info">.append() example</span> .target
</div>
<div class="well target2">
<span class="label label-info">.appendTo() example</span> .target2
</div> |
<div class="well target">
<span class="label label-info">.append() example</span> .target
</div>
<div class="well target2">
<span class="label label-info">.appendTo() example</span> .target2
</div>
The same difference applies to: