title: Removing dynamically created divs with jquery
body: <p>EDIT: Just so I asks questions better next time. I got a -1 what did I do wrong? </p>
  
  <p>I'm adding quite a lot of html dynamically and want to be able to remove them also one by one. </p>
  
  <p>Below the JQuery. I want to be able to remove the whole $("#row1' + (counter) + '") div including all divs in it by clicking the remove button under it.</p>
  
  <p>Here's a fiddle: <a href="http://jsfiddle.net/FullContCoder/Sf9r5/1/" rel="noreferrer">http://jsfiddle.net/FullContCoder/Sf9r5/1/</a></p>
  
  <p>Thanks a lot in advance!</p>
  
  <pre><code>$(document).ready(function() {
  
      var counter = 0;
  
      $(".addButton").click(function() {
  
      var test =    $( '&lt;div id="row1' + (counter) + '" class="row"&gt;&lt;div class="col-md-2"&gt;&lt;p&gt;&lt;small&gt;Placement Name:&lt;/small&gt;&lt;/p&gt;&lt;input id="inputPlacement' + (counter) + '" type="text" class="form-control input-sm" name="placementName" placeholder="ex: Homepage"&gt;' +
              '&lt;/div&gt;&lt;div class="col-md-3"&gt;&lt;p&gt;&lt;small&gt;URL:&lt;/small&gt;&lt;/p&gt;&lt;input id="inputURL" type="url" class="form-control input-sm" name="url" placeholder="ex: http://www.allure.com"&gt;&lt;/div&gt;' +
              '&lt;div class="col-md-2"&gt;&lt;div class="row"&gt;&lt;div class="col-md-12"&gt;&lt;p&gt;&lt;small&gt;Select a Date and Time:&lt;/small&gt;&lt;/p&gt;&lt;/div&gt;&lt;/div&gt;&lt;div class="row"&gt;&lt;div class="col-md-12"&gt;' +
              '&lt;div class="input-append date" id="dp3" data-date="12-02-2012" data-date-format="dd-mm-yyyy"&gt;&lt;input class="span2" size="16" type="text" value="12-02-2012" readonly=""&gt;&lt;span class="add-on"&gt;&lt;i class="icon-calendar"&gt;&lt;/i&gt;' +
              '&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;div class="row"&gt;&lt;div class="input-append bootstrap-timepicker"&gt;&lt;input id="timepicker1" type="text" class="input-small"&gt;&lt;span class="add-on"&gt;' +
              '&lt;i class="glyphicon glyphicon-time"&gt;&lt;/i&gt;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;div class="col-md-2"&gt;&lt;p&gt;&lt;small&gt;Recurring:&lt;/small&gt;&lt;/p&gt;&lt;select id="recurring" class="form-control input-sm"&gt;' +
              '&lt;option name="daily" value="daily"&gt;Daily&lt;/option&gt;&lt;option name="weekly" value="weekly"&gt;Weekly&lt;/option&gt;&lt;option name="month" value="month"&gt;Month&lt;/option&gt;&lt;/select&gt;&lt;/div&gt;' +
              '&lt;div class="col-md-2"&gt;&lt;p&gt;&lt;small&gt;Day of Week:&lt;/small&gt;&lt;/p&gt;&lt;div class="row"&gt;&lt;div class="col-md-6"&gt;&lt;label class="checkbox-inline"&gt;&lt;input id="mon" name="test" type="checkbox" value="1"&gt; Mon&lt;/label&gt;' +
              '&lt;/div&gt;&lt;div class="col-md-6"&gt;&lt;label class="checkbox-inline"&gt;&lt;input id="fri" name="test" type="checkbox" value="1"&gt; Fri&lt;/label&gt;&lt;/div&gt;&lt;/div&gt;&lt;div class="row"&gt;&lt;div class="col-md-6"&gt;' +
              '&lt;label class="checkbox-inline"&gt;&lt;input id="tue" name="test" type="checkbox" value="1"&gt; Tue&lt;/label&gt;&lt;/div&gt;&lt;div class="col-md-6"&gt;&lt;label class="checkbox-inline"&gt;' +
              '&lt;input id="sat" name="test" type="checkbox" value="1"&gt; Sat&lt;/label&gt;&lt;/div&gt;&lt;/div&gt;&lt;div class="row"&gt;&lt;div class="col-md-6"&gt;&lt;label class="checkbox-inline"&gt;' +
              '&lt;input id="wen" name="test" type="checkbox" value="1"&gt; Wed&lt;/label&gt;&lt;/div&gt;&lt;div class="col-md-6"&gt;&lt;label class="checkbox-inline"&gt;' +
              '&lt;input id="sun" name="test" type="checkbox" value="1"&gt; Sun&lt;/label&gt;&lt;/div&gt;&lt;/div&gt;&lt;div class="row"&gt;&lt;div class="col-md-6"&gt;&lt;label class="checkbox-inline"&gt;' +
              '&lt;input id="thu" name="test" type="checkbox" value="1"&gt; Thu&lt;/label&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;div class="col-md-1"&gt;&lt;p&gt;&lt;small&gt;Remove:&lt;/small&gt;&lt;/p&gt;' +
              '&lt;button type="button" class="removeButton btn btn-default btn-sm"&gt;&lt;span class="glyphicon glyphicon-minus-sign"&gt;&lt;/span&gt;&lt;/button&gt;&lt;/div&gt;&lt;/div&gt;' )
  
  
  
          $('.removeButton').click(function() {
              $("#row1' + (counter) + '").remove();
          });
  
          counter++;
  
  
         $("#row1").after(test);
      });
  
  
  
  
  });
  </code></pre>