Use jQuery to read dynamically created content
<p>I am something of a novice when it comes to jQuery but thanks to another stackoverflow member I have some code which allows users to click a radio button and have it add a table row filled with the text of the radio button link they clicked on. Here's the jQuery code:</p>

<pre><code>$('.addRow').click(function() {
    var tr = $(
        '&lt;tr&gt;&lt;td class="cat"&gt;&lt;/td&gt;' 
        + '&lt;td class="sel"&gt;&lt;/td&gt;'
        + '&lt;td&gt;&lt;textarea name="cmo-paragraph[' + count + ']"&gt;Click to edit (id ' 
        + count 
        + ')&lt;/textarea&gt;&lt;/td&gt;&lt;/tr&gt;'
    );

    $('.mainTable &gt; tbody:last').one().append(tr);
    tr.find(".cat").text($(this).closest("li.category").attr("title"));
    tr.find(".sel").text($(this).closest("li.select").attr("title"));
    count++;
});
</code></pre>

<p>Here's a snippet of the radio list:</p>

<pre><code>&lt;li class="category" value="1" title="Chronic Pain Referral"&gt;Chronic Pain Referral
    &lt;ul&gt;
        &lt;li class="select" title="Chronic referral"&gt;
            &lt;input type="radio" class="addRow" id="radio1" name="modalities" value="1"&gt;
            &lt;label for="radio1"&gt;Chronic referral&lt;/label&gt;
        &lt;/li&gt;
    &lt;/ul&gt;
&lt;/li&gt;
</code></pre>

<p>This will successfully add a row to a table each time with the 'category' and 'select' table cells filled with 'Chronic Pain Referral' and 'Chronic referral' respectively on the frontend.</p>

<p>The problem is I want to be able to submit this information in a form to save to a database. I can iterate through the rows thanks to the 'count' variable so I can capture the textarea data but the values of the 'category' and 'select' cells for each row currently aren't passed.</p>

<p>I attempted the following code change but it appears not to work:</p>

<pre><code>$('.addRow').click(function() {
    var tr = $(
        '&lt;tr&gt;&lt;td class="cat"&gt;&lt;input type="hidden" class="hiddenCat" name="category[' + count + ']"&gt;&lt;/td&gt;' 
        + '&lt;td class="sel"&gt;&lt;/td&gt;'
        + '&lt;td&gt;&lt;textarea name="paragraph[' + count + ']"&gt;Click to edit (id ' + count + ')&lt;/textarea&gt;&lt;/td&gt;&lt;/tr&gt;'
    );

    $('.mainTable &gt; tbody:last').one().append(tr);
    tr.find(".cat").text($(this).closest("li.category").attr("title"));
    tr.find(".hiddenCat").text($(this).closest("li.category").attr("value"));
    tr.find(".sel").text($(this).closest("li.select").attr("title"));
    count++;
});
</code></pre>
