html - How to add text to an existing div with jquery

Question

I want to add text to an existing div, when I click the Button with the id #add. But this is not working.

Here my code:

$(function () {
  $('#Add').click(function () {
    $('<p>Text</p>').appendTo('#Content');
  });
}); 

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
 <div id="Content">
    <button id="Add">Add</button>
 </div>

Answer 1

You need to define the button text and have valid HTML for the button. I would also suggest using .on for the click handler of the button

$(function () {
  $('#Add').on('click', function () {
    $('<p>Text</p>').appendTo('#Content');
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div id="Content">
    <button id="Add">Add Text</button>
</div>