Let me preface my question with my limited understanding of web design.

I would like for the "-More-" text to become "-Less-" when clicked, then back to "-More-" when clicked again.

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?

My javascript as follows:

```
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';
    }
  }
}

```

My html as follows:

```
  <div class="accordion">
    <p>1. Decide
    <a href="#" id="exampleone-show" class="showLink"
    onclick="showHide('exampleone');return false;"><div class="btn_show">-More-</div></a>
    <p></p>
  </div>
  <div id="exampleone" class="more">
    <p>Blah Blah Blah.</p>
  </div>

```

Thanks in advance.