jQuery: appending content to a <div> with a certain id

I have some code which generates lots of textboxes using jQuery. At the moment it just adds them to the bottom of the page in my form.

I have created a div called "timearea" that I'd like to put these textboxes in.开发者_StackOverflow中文版 How do I append to it using jQuery?

<div id="timearea"> </div>

This is the current code I tried but it broke my js.

  $('body').append('timearea');

jQuery selectors require a '#' prefix for IDs and '.' prefix for class names, otherwise jQuery thinks you are trying to select a DOM element by its name (like 'div' or 'ul').

Try this (.html() grabs the contents of your selected element):

<script type="text/javascript">
    $(document).ready(function() {
        $('body').append($('#timearea_DIV').html());
    });
</script>
...

<div id="timearea_DIV">
    <div id="timearea"></div>
</div>

Are you looking for this:

$('#timearea').append([html for textbox]);

The correct use of append would be to add the actual HTML:

$('body').append('<div>timearea</div>');

Notice that i've omitted the id, because if you're doing it multiple times you can't have multiple IDs (it would need to be a class).

This is assuming that you wanted to add a div to the bottom of your document, the question isn't clear.

If you wanted to add some HTML to the 'timearea' div, you need:

$("#timearea").append("[some HTML here]");

$('#timearea').appendTo('body');

$('body').append($('#timearea'));

Do note though that the original node will be actually moved instead of copied after using append().

Try the following:

$('body').append(($('#timearea')).html());

Here you will get basic concept on JQuery ID Selector.