after addClass to <button> an function doesnt work

after addClass to <button> an function doesnt work

  2. <!DOCTYPE html>
  3. <html>
  4. <head>
  5. <link rel="stylesheet" href="css/basic.css"/>
  6. <script type="text/javascript" src="js/jquery-2.0.2.js"></script>
  7. <script type="text/javascript" src="js/basic.js"></script>
  8. </head>
  9. <body>
  10. <div id="start">
  11. <button class="create">
  12.             New Form
  13. </button>
  14. </div>
  15. <div id="main">
  17. </div>
  18. </body>
  19. </html>

  21. This is my HTML and this here my JS:

  24. $(document).ready(function() {
  25. var linecountername = 0;
  26. $('.create').on('click' , function(e) {
  27. $(this).hide();
  28. linecountername = linecountername + 1;
  29. $('#main').append('<div class="' + linecountername +'"></div>');
  30. $('.' + linecountername).css({
  31. "border" : "1px solid black",
  32. "font-size": "5em",
  33. });
  34. $('.' + linecountername).append('<a>&equiv;</a><input type="text" placeholder="labelname" required/><button>+</button>')
  35. $('.' + linecountername + ' button').addClass('create');
  36. })
  37. });
  39. after clicking on created button the function doesnt work anymore.
  40. I don' t know how to explain my problem. Hope you understand what I mean.