title: Change text with different text on click
body: <p>Let me preface my question with my limited understanding of web design.</p>
  
  <p>I would like for the "-More-" text to become "-Less-" when clicked, then back to "-More-" when clicked again.</p>
  
  <p>I already have some javascript present within the code I am trying to modify. Could this be combined with what I am asking to achieve the same result?</p>
  
  <p>My javascript as follows:</p>
  
  <pre><code>function showHide(shID) {
    if (document.getElementById(shID)) {
      if (document.getElementById(shID+'-show').style.display != 'none') {
          document.getElementById(shID+'-show').style.display = 'none';
          document.getElementById(shID).style.display = 'block';
      }
      else {
          document.getElementById(shID+'-show').style.display = 'inline';
          document.getElementById(shID).style.display = 'none';
      }
    }
  }
  </code></pre>
  
  <p>My html as follows:</p>
  
  <pre><code>  &lt;div class="accordion"&gt;
      &lt;p&gt;1. Decide
      &lt;a href="#" id="exampleone-show" class="showLink"
      onclick="showHide('exampleone');return false;"&gt;&lt;div class="btn_show"&gt;-More-&lt;/div&gt;&lt;/a&gt;
      &lt;p&gt;&lt;/p&gt;
    &lt;/div&gt;
    &lt;div id="exampleone" class="more"&gt;
      &lt;p&gt;Blah Blah Blah.&lt;/p&gt;
    &lt;/div&gt;
  </code></pre>
  
  <p>Thanks in advance.</p>