title: JQuery and accessing nested input element's value of a blog post
body: <p>I'm working on a blog of my own something like a facebook clone of some sort. I need to make it possible to delete some posts and what I plan to do, is inserting into each post, a hidden (not hidden yet) input with the post id. So I have a big string for each post which goes like this:</p>
  
  <pre><code>    $('#blog').append('&lt;div class="blogPost"&gt;&lt;div class="postTitre"&gt;' +title + '&lt;/div&gt;' + 
                            '&lt;div class="postDescription"&gt;' + description + '&lt;/div&gt;' + 
                            '&lt;div class="postTimeStamp"&gt;' + timestamp + '&lt;/div&gt;' + 
                            '&lt;embed class="embedPDF" src="./uploads/' + name + '#toolbar=0&amp;navpanes=0&amp;scrollbar=0"/&gt;' + 
                            '&lt;div class="closeDelete"&gt;
                                &lt;input type="text" name="txtID" readonly="readonly" value="' + id + '" /&gt;X
                                &lt;div class="close-text"&gt;DELETE&lt;/div&gt;' +
                            '&lt;/div&gt;
                         &lt;/div&gt;');
  </code></pre>
  
  <p>I need to access the inner input type named txtID which will be hidden.</p>
  
  <p>I tried a lot of stuff to get that to work, but none is doing what I want. Rigth now, I have this code which uses event delegation, but not sure about how to get the value of my text input:</p>
  
  <pre><code>            //THIS WILL FIRE THE DELETE POST EVENT
              $("#blog").on("click", "div.closeDelete", function(){
                  var id = $("div.closeDelete").find("input[name=txtID]").val();
                  alert("close delete this: " + id + " post");
              });
  </code></pre>