Изменить текст кнопки в jQuery или JavaScript

Question

У меня есть несколько кнопок, каждый из которых имеет определенный класс, чтобы отличать его от других подобных кнопок. Имя класса следует за форматом moreid, где id изменяется с помощью кнопки. Я использую следующий код, чтобы изменить текст кнопки:

function changeText(btn){ 
    $('.'+btn).text(function(i, text){ 
    return text === "Show More" ? "Show Less" : "Show More";} 
)} 

Я называю эту функцию с помощью changeText(moreid). С помощью этого кода я получаю сообщение об ошибке:

Error: Syntax error, unrecognized expression: .[object HTMLDivElement] 

Это HTML кнопки

<button type="button" 
     class="btn btn-primary btn-lg moreapple" 
     data-toggle="collapse" 
     data-target="#moreapple" 
     onclick="changeText(moreapple)">Show More</button> 

Единственное, что переход от одной кнопки к другому moreapple к morenews и т.д.

Как может Я изменяю эту функцию, чтобы изменить текст кнопки?

Answer 1

Ваш changeText(btn) говорит, что вы передаете btn в качестве аргумента, так что вы, возможно, придется дать этому попытку

$(btn).text(function(i, text){ 
    return text === "Show More" ? "Show Less" : "Show More"; 
}); 

Ваша разметка должна быть, как это, если вы не имеете специфические требования

<button type="button" 
     class="btn btn-primary btn-lg moreapple" 
     data-toggle="collapse" 
     data-target="#moreapple" 
     onclick="changeText(this)">Show More</button> 

использование $(btn) как это происходит от вызывающей функции changeText()

Fiddle Example

Answer 2

Очевидно ваши идентификаторы будут отличаться в зависимости от вашего именования Duplicate Question Answer

var status = "less"; 

function toggleText() 
{ 
    var text="Here is some text that I want added to the HTML file"; 

    if (status == "less") { 
     document.getElementById("textArea").innerHTML=text; 
     document.getElementById("toggleButton").innerText = "See Less"; 
     status = "more"; 
    } else if (status == "more") { 
     document.getElementById("textArea").innerHTML = ""; 
     document.getElementById("toggleButton").innerText = "See More"; 
     status = "less" 
    } 
} 

Answer 3

Вам необходимо обновить разметку из

<button type="button" 
     class="btn btn-primary btn-lg moreapple" 
     data-toggle="collapse" 
     data-target="#moreapple" 
     onclick="changeText(moreapple)">Show More</button> 

в

<button type="button" 
     class="btn btn-primary btn-lg moreapple" 
     data-toggle="collapse" 
     data-target="#moreapple" 
     onclick="changeText('moreapple')">Show More</button> <!-- Pass moreapple as string -->