title: Not able to pick the value of dynamically created Second textbox with the same name
body: <p>I have a page in which i am creating a dynamic textbox element(newComment) box by iterating a loop inside  getMessages() method so my loop is creating two text boxes and calling addComment() method in the loop and trying to fetch the value of second textbox inside addcomment() . but i am not able to get the value of second textbox as it picks value on first text box only .
  Can you please suggest what i have to do to correct this and other approach also to fix this. </p>
  
  <pre><code>&lt;%@ page language="java" contentType="text/html; charset=ISO-8859-1"
  pageEncoding="ISO-8859-1"%&gt;
  &lt;!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"    "http://www.w3.org/TR/html4/loose.dtd"&gt;
  &lt;html&gt;
  &lt;head&gt;
  &lt;meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"&gt;
  &lt;title&gt;profile page&lt;/title&gt;
  
  &lt;script src="/WebServices/js/jquery-2.1.1.min.js" type="text/javascript"&gt;&lt;       &lt;/script&gt;
  </code></pre>
  
  <p></p>
  
  <pre><code>function showProfile(){
      var profileName = sessionStorage.profileName;
  
      var url="rest/profiles/"+profileName;
      //alert(profile.profileName);
  
      $.ajax(
              {
                  type:'GET',
                  url:url, 
                  dataType:'json',
                  contentType: "application/json; charset=utf-8",
                  success:function(data)
                  {
                              $("#getprofile").append("&lt;b&gt;profileName:&lt;/b&gt;"+data.profileName);
                              $("#getprofile").append("&lt;b&gt;firstName:&lt;/b&gt;"+data.firstName);
                              $("#getprofile").append("&lt;b&gt;lastName:&lt;/b&gt;"+data.lastName+ "&lt;br/&gt;");
                              //$("#getprofile").append("&lt;br/&gt;"+'&lt;input type="submit"   value="'+data[i].profileName+'"onClick="getProfile();return false;"&gt;'+"&lt;br/&gt;");
                              $("#getprofile").append("&lt;br/&gt;"+"&lt;a href='#' onclick='getMessages();'&gt;My Messages&lt;/a&gt;");
                              //&lt;a href="url"&gt;link text&lt;/a&gt;
  
                  }
              }
      );
  
  }   
  
  
  function getMessages(){ 
      $.ajax(
              {
                  type:'GET',
                  url:'rest/messages', 
                  dataType:'json',
                  contentType: "application/json; charset=utf-8",
                  success:function(data)
                  {
                          for (var i=0;i&lt;data.length;++i){
                          var responseData=JSON.stringify(data);
                          //alert(data.comment);
  
                              $("#authResponse").append("&lt;br/&gt;"+"&lt;b&gt;MessageId:&lt;/b&gt;"+data[i].id);
                              $("#authResponse").append("&lt;b&gt;Message:&lt;/b&gt;"+data[i].message);
                              $("#authResponse").append("&lt;b&gt;Author:&lt;/b&gt;"+data[i].author+ "&lt;br/&gt;");
                              $("#authResponse").append("&lt;br/&gt;"+'&lt;a href="#" onclick=getComment(\''+data[i].id+'\');&gt;view Comments&lt;/a&gt;'+"&lt;br/&gt;"+"&lt;br/&gt;");
                              $("#authResponse").append('&lt;input type="text" name="newComment" id="newComment"/&gt;');
                              $("#authResponse").append("&lt;br/&gt;"+'&lt;input type="submit"   value="Add comment" onClick="addComment(\''+data[i].id+'\');return false;"&gt;'+"&lt;br/&gt;");
  
  
                          }
                  }
              }
  
      );
  }
  
  
  function getComment(messageId){
  
      var getCommentURL="rest/messages/"+messageId+"/comments";
      alert(getCommentURL);
      $.ajax(
  
          {
              type:'GET',
              url:getCommentURL,
              dataType:'json',
              contentType:"application/json; charset=utf-8",
              success:function(data)
              {   
                  if($.trim(data))
                  {
                      for (var i=0;i&lt;data.length;++i){
                          $("#getComments").append("&lt;b&gt;Id:&lt;/b&gt;"+data[i].id);
                          $("#getComments").append("&lt;b&gt;Comment :&lt;/b&gt;"+data[i].message);
                          $("#getComments").append("&lt;b&gt;Author :&lt;/b&gt;"+data[i].author);
                      }
                  }else{
                      alert("No comments are added for this message.!!")
                  }
              },
              error: function (error) {
                    alert('error inside getComment method');
              }   
          }   
  
      );
  }
  function addComment(messageId){
  
      //var comment = $("input#newComment").val();
      //var comment= document.getElementById('newComment').value;
      alert("comment:"+comment);
      var postCommentURL="rest/messages/"+messageId+"/comments";
      var authRequest = {"message":comment,"author":"system"};
  
      $.ajax(
      {
              type:'POST',
              url:postCommentURL,
              data:JSON.stringify(authRequest),
              dataType:'json',
              contentType:"application/json; charset=utf-8",
              success:function(data)
              {       
                      for (var i=0;i&lt;data.length;++i){
                          alert("yo");
                          $("#addcommentResult").append("comment has been added successfully.!!");
                          if(data[i].id!=null){
                              $("#addcommentResult").append("comment has been added successfully.!!");
                          }
                          else{
                              $("#addcommentResult").append("comment not added.!!");
                          }
                      }
              },
              error: function (error) {
                    alert('error inside addComment method');
              }   
          }   
  
      );
  
  }   
  </code></pre>
  
  <p>   </p>
  
  <p>
  </p>
  
  
  
  <pre><code>My Profile&lt;br/&gt;&lt;br/&gt;
  &lt;div id = getprofile&gt;&lt;/div&gt;
  &lt;div id = authResponse&gt;&lt;/div&gt;
  &lt;div id = getComments&gt;&lt;/div&gt;
  &lt;div id = addcommentResult&gt;&lt;/div&gt;
  </code></pre>
  
  <p>
  </p>