Изменить текст кнопкой с помощью javascript?

Question

У меня есть список часто задаваемых вопросов, который работает именно так: есть несколько мини-карт, содержащих вопрос (какой-то текст) и кнопку (скажем, «см. Ответ»). Когда я нажимаю на кнопку, ответ на вопрос появляется над кнопкой. Тогда кнопка не должна быть кнопкой «видеть ответ», а «закрыть». Мне нужна небольшая помощь с этой последней частью.

Вот что я сделал:

<p>Question</p> 
<div class="collapse" id="FAQ"> 
    <div class="well"> 
     Answer to the question 
    </div> 
</div> 
<a class="btn" role="button" data-toggle="collapse" href="FAQ" aria-expanded="false" aria-controls="collapseExample">See the answer</a> 

Боковой вопрос: так как это список, и я буду иметь несколько «Смотрите ответ/Закрыть» кнопки, я бы сказал, что я не разрешено использовать идентификатор, чтобы он работал, не так ли?

Answer 1

Вы можете динамически устанавливать текст на кнопке на $(".btn").innerHTML = "new text to be displayed". Поместите это в свою первую функцию click(function() {...}).

И нет, никогда использовать тот же идентификатор для нескольких элементов. Вместо этого используйте классы. Вы можете иметь несколько классов для одного элемента. Например, у вас может быть class="btn close", а затем используйте toggleClass("close"), чтобы добавить его, когда его там нет, удалите его, когда он есть.