title: How to change text onclick using JavaScript?
body: <p>There are multiple rows like </p>
  
  <p>Name  &nbsp;&nbsp;status</p>
  
  <p>a&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;YES (hyperlink)<br/>
  b&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;NO  (hyperlink)<br/>
  c&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;YES (hyperlink)<br/></p>
  
  <p>My Code is:</p>
  
  <pre><code>function change_text() {
    var button = document.getElementById('toggle_button');
    if (button.innerHTML === "YES") {
        button.innerHTML = "NO";
    }
    else {
        button.innerHTML = "YES";
    }
  }
  </code></pre>
  
  <p></p>
  
  <pre><code>&lt;a href='javascript: toggle()'&gt;&lt;p id="toggle_button" onclick="change_text()"&gt;YES&lt;/p&gt;&lt;/a&gt;
   &lt;a href='javascript: toggle()'&gt;&lt;p id="toggle_button" onclick="change_text()"&gt;NO&lt;/p&gt;&lt;/a&gt; 
  &lt;a href='javascript: toggle()'&gt;&lt;p id="toggle_button" onclick="change_text()"&gt;YES&lt;/p&gt;&lt;/a&gt;
  </code></pre>
  
  <p>onclick its happening for first row only kindly provide some solution. I am new on javascript or stackoverflow. in case any question please do the comment.</p>