Note that there are some explanatory texts on larger screens.

plurals
  1. POJquery using the each iterator
    text
    copied!<p>I am appending data to a table using append. I would like to be able to delete each row I append one by one. However the way it's working now is it deletes all children. What am I doing wrong?</p> <p><a href="http://jsfiddle.net/HjFPR/44/" rel="nofollow">http://jsfiddle.net/HjFPR/44/</a></p> <pre><code>&lt;table class="" width="300" border="0" cellpadding="0" cellspacing="0"&gt; &lt;tr&gt;&lt;th&gt;Date&lt;/th&gt;&lt;th&gt;Pokemanz&lt;/th&gt;&lt;th align="right" style="text-align:right;"&gt;Value&lt;/th&gt;&lt;/tr&gt; &lt;tr&gt;&lt;td style="width:62px;"&gt;&lt;input type="text" class="transactions_date" size="15" value="4/5/12"/&gt; &lt;/td&gt;&lt;td&gt;&lt;input type="text" class="transaction_title" size="30" value="Pickachu"/&gt;&lt;/td&gt;&lt;td align="right"&gt; &lt;input type="text" class="transactions_amount" size="10" value="$25"/&gt;&lt;/td&gt;&lt;/tr&gt; &lt;/table&gt; &lt;div class="new_transaction"&gt;&lt;/div&gt; &lt;input type="button" value ="Add Transaction" id="add_trans"/&gt; &lt;input type="button" value ="Delete Transaction" id="delete_trans" /&gt; </code></pre> <p>​</p> <pre><code>(function() { $('#add_trans').on('click',function () { $('.new_transaction').append('&lt;tr&gt;&lt;td style="width:62px;"&gt;&lt;input type="text" class="transactions_date" size="15" value=""/&gt;&lt;/td&gt;&lt;td&gt; &lt;input type="text" class="transaction_title" size="30" value=""/&gt;&lt;/td&gt;&lt;td align="right"&gt;&lt;input type="text" class="transactions_amount" size="10" value=""/&gt;&lt;/td&gt;&lt;/tr&gt;'); }); $('#delete_trans').on('click',function () { $('.new_transaction').children().each(function () { $(this).remove(); // "this" is the current element in the loop }); }); })(); </code></pre>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload