title: Removing dynamically generated html with jQuery
body: <p>I want to remove dynamically generated '.row' but it is possible only for the static one.
  Second row is generated dynamically.</p>
  
  <p>I wanted to provide image but I have not enough reputation.
  Here are my code snippets:<br>
  1. Static '.row'
      
          
              
                  
              </p>
  
  <pre><code>        &lt;div class="col-sm-4" style="padding-left: 0;"&gt;
              &lt;select&gt;
                  &lt;option value=""&gt;Skill Level&lt;/option&gt;
                  &lt;option value=""&gt;1&lt;/option&gt;
                  &lt;option value=""&gt;2&lt;/option&gt;
                  &lt;option value=""&gt;3&lt;/option&gt;
              &lt;/select&gt;
          &lt;/div&gt;
          &lt;div class="col-sm-2" style="padding-left: 0;"&gt;
              &lt;div class="delete-myskill-candidate progress-bar-candidate toggle"&gt;
                  &lt;a class="progress-bar-candidate-toggle"&gt;-&lt;/a&gt;
              &lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>2. Code for removing '.row'. Works fine for static row but it can't remove dynamically generated rows. </p>
  
  <pre><code>$('.delete-myskill-candidate').on('click', function (events) {     
      $(this).closest(".row").remove();  
  });
  </code></pre>
  
  <p>3. Rows are generated based on static one and jQuery append().</p>
  
  <pre><code>$("#mySkills").append(firstDiv.append(selectList).append(deleteButton));
  </code></pre>
  
  <p>firstDiv, selectList and deleteButton are same as in HTML.</p>
  
  <p>I think that dynamically generated content need some kind of 'binding' but I don't have a clue how to achieve that. Any suggestions?</p>