I have this HTML
<ul class="list-row">
<li>
<input name="field1" class="field1" type="text" placeholder="field 1">
<input name="field2" class="field2" type="text" placeholder="field 2">
<p class="delrow">Delete row</p>
</li>
<li>
<input name="field1" class="field1" type="text" placeholder="field 1">
<input name="field2" class="field2" type="text" placeholder="field 2">
<p class="delrow">Delete row</p>
</li>
<p class="addrow">Add row</p>
</ul>
And when i click on Add row i append a new li with the elements that i need. The function on jQuery
is this one:
$(".addrow").on("click",function() {
$(this).before("<li>\n\
<input name='field1' class='field1' type='text' placeholder='field 1' />\n\
<input name='field2' class='field2' type='text' placeholder='field 2' />\n\
<p class='delrow'>Delete row</p></li>");
});
What i need is to attach the click event to the new delrow that is appended to the DOM. I tried selecting getting the siblings and finding the p element but i can't make it work.