Как изменить текст кнопки при клике?

Question

[dm]

Есть обычная кнопка:

<a class="js-btn-readmore" href="#">Подробнее</a>

Нужно, чтобы при клике "Подробнее" менялось на "Скрыть" и наооборот.
У меня получается только в одну сторону:

var readMoreBtn = document.querySelector(".js-btn-readmore"),
    readMoreContent = document.querySelector(".js-description-info")

readMoreBtn.addEventListener("click", function(event) {
    event.preventDefault();
    readMoreContent.classList.toggle("js-readmore-show");

    readMoreBtn.innerHTML = readMoreBtn.innerHTML.replace('Подробнее', 'Скрыть');
});

Как правильно сделать переключение Подробнее/Скрыть?
Кнопка внизу страницы- del

Answer 1

[Пашенька]

Например так:

var readMoreBtn = document.querySelector(".js-btn-readmore"),
    readMoreContent = document.querySelector(".js-description-info");

readMoreBtn.addEventListener("click", function(event) {
    event.preventDefault();
    readMoreContent.classList.toggle("js-readmore-show");
    this.textContent = this.textContent === 'Подробнее' ? 'Скрыть' : 'Подробнее';
});

Comments

[dm]

Начинает срабатывать только со 2-го клика. Это можно поправить?

[Пашенька]

dm: У меня работает как надо - fiddle

[dm]

Хм. В примере работает, а на сайте со 2-го почему-то - dmink.link

[Пашенька]

dm: Всё потому что там **хрена пробельных символов - уберите и будет ок

[dm]

like-a-boss: Да, в проблелах был косяк. А я так старался, красиво форматировал...

[Пашенька]

dm: На самом деле у вас неверное форматирование. Ссылки никто не разрывает на несколько строк. Можете любой online html-beautifier заюзать, руками такое в 2015-ом не делается.

[dm]

like-a-boss: Поправил, спасибо. Учту в будущем

Answer 2

[VZVZ]

Почему бы не погуглить javascript toggle innerhtml? Тем более, вопрос довольно тривиальный и ответов должно быть много самых разных.
Вот, например:
stackoverflow.com/questions/9694346/toggle-innerhtml

Comments

[VZVZ]

dm: и почему бы не использовать этот самый jQuery, если он облегчает разработку? Хотя бы для пробы. Синдром утенка?

[VZVZ]

dm: без jQuery и пр. особо красивых и лаконичных решений в принципе не бывает. Если бы все и так было красиво, то он не нужен был бы.