Question

I am having some luck when i try appending some text to an existing div using

$("<div class='form-holder'>Append a form here</div>").appendTo('.container');

but everything goes south from there when i try

$(document).ready
(
function()
{
//$("<div class='form-holder'>Append a form here</div>").appendTo('.container');
$("<div class='form-holder'>"
"<form name="input" action="#" method="get">"
"<label>Slider Title:</label> <input type="text" name="slider_title" /><br/><br/>"
"<label>Slider Description:</label> <input type="text" name="slider_description" /><br/><br/>"
"<input type="submit" value="New Slider" />"
"<input type="submit" value="Update Slider" />"
"</form>"
"</div>").appendTo('.container');
}
);

You can see the fiddle here http://jsfiddle.net/F7YAe/

Answer 1

Try replace your " with ' and using the string concatenation operator +

Notice how my code is colored correctly, while yours is not. You cannot use that same type of quotes in JS and the HTML that lives within JS.

        $("<div class='form-holder'>" +
        "<form name='input' action='#' method='get'>" +
        "<label>Slider Title:</label> <input type='text' name='slider_title' /><br/><br/>" +
        "<label>Slider Description:</label> <input type='text' name='slider_description' /><br/><br/>" +
        "<input type='submit' value='New Slider' />" +
        "<input type='submit' value='Update Slider' />" +
        "</form>" +
        "</div>").appendTo('.container');