Getting element id from inside after() function

Getting element id from inside after() function

I need to start with HTML like this:
<input type='text' id='first'>
<input type='text' id='second'>


And turn it into something like this dynamically:
<input type='text' id='first'><p>first</p>
<input type='text' id='second'><p>second</p>


Here's what I have so far:
$("input").after( "<p>" + $(this).attr("id") + "</p>" );


The problem is, this produces "<p>undefined</p>" for each element. How do I reference the id of the input?

Thanks for any help.