Как доработать скрипт, чтобы слова удалялись?

[Metrologik]

Здравствуйте уважаемые форумчане! Есть код на javascript, который при клике на слово меняет его на заданное. Если кликнуть повторно, то это слово добавляется повторно и вся конструкция окружается фигурными кавычками.
То есть было слово текст. После клика по нему оно заменилось на слово текст1. Кликнули еще раз, образовалась конструкция {текст1|текст1} и т.д…
Сам код: https://jsfiddle.net/sa26uwxt/381/

Как сделать переключатель и дописать код, чтобы после переключения при клике удалялось конкретное слово?
То есть кликнул в конструкции на второе слово текст1, а именно {текст1|текст1|текст1} и осталась конструкция {текст1|текст1}, а выделенное выше слово удалилось. И в конце если осталась конструкция {текст1|текст1}, то при удалении одного из слов окружающие фигурные скобки тоже убирались, оставляя просто слово?

[Baburek]

Приложенный вами код как-то не очень напоминает то, что вы описали. Понимаю, что уже не актуально, но делается как-то так(можно лучше, доработайте сами):

<button onclick="addText()">Add Text</button>
<div id="test"></div>

<script>
var textArr = [];

function addText(){
  textArr.push('<span class="items" onclick="removeText(this)">text'+(textArr.length+1)+'</span>');
  showTextArr();
}

function showTextArr(){
  if(textArr.length <= 1){
    document.getElementById('test').innerHTML = textArr;
  } else {
    document.getElementById('test').innerHTML = "{"+textArr+"}";
  }
}

function removeText(elem){
  for(var i = 0; i<textArr.length; i++){
    if(textArr[i] === elem.outerHTML){
      textArr.splice(i, 1);
      break;
    }
  }
  showTextArr();
}
</script>