title: how to change button text by onclick in jquery
body: <p>In my coding, I have a button Text as "Invite" for each user.</p>
  
  <p>When I on click the button, the button text should be change as 
  'Pending Request", by using document.getElementById()
  the first button text is changing. What my requirement is what all the button I am clicking the particular button text should be change.</p>
  
  <p>But for me the First button text alone changing when clicking other buttons.</p>
  
  <p>Here is a coding:</p>
  
  <p><strong>Html code:</strong></p>
  
  <pre><code>&lt;div class="button_wrapper"&gt;
       &lt;input onclick="getInvitevalue(__iProfId__)" type="button" value="Invite" name="InviteTeacher" class="InviteTeacher" id= "InviteTeacher"/&gt;              
  &lt;/div&gt; 
  </code></pre>
  
  <p><strong>Java Script code:</strong></p>
  
  <pre><code>function getInvitevalue(profileid) {
      //alert(profileid);
      var x = document.getElementById("InviteTeacher");
      if (x.value == "Pending Request")
          x.value = "Invite";
      else
          x.value = "Pending Request";
  }
  </code></pre>
  
  <p>How I can resolve this</p>