Изменить теги и классы

Question

У меня есть приложение для викторины, в котором пользователи могут выбирать свои собственные предопределенные вопросы и ответы, но мне нужно изменить теги и классы HTML.

Я попытался использовать методы jQuery replaceWith и removeClass addClass, но он просто не работает. Может кто-нибудь помочь, пожалуйста. Ниже приведен пример моего кода:

Пользователь нажимает на элемент span для ответа на вопрос, затем появляется следующий вопрос.

HTML код в Викторине Страница:

<p id='question1' class = "quizQuestions">What element would I be? 
    <span>Water</span> 
    <span>Earth</span> 
    <span class="correctAnswer">Fire</span> 
    <span>Wind</span> 
</p> 

Javascript для лже:

var questionNumber = 1; 
var score = 0; 
function showQuestion(question) { 
    $('p').hide(); 
     if ($("p:nth-of-type(" + question + ")").length>0){ 
      $("p:nth-of-type(" + question + ")").show(); 
    } else { 
     $("#final").show(); //this shows the player the score at the end 
    } 
} 

$('span').click(function() { 
    if ($(this).hasClass("correctAnswer")) { 
    score++; 
} 

$('.score').html(score); 
    questionNumber++; 
    showQuestion(questionNumber); 
}); 

showQuestion(questionNumber); 

У меня есть другой раздел кода для пользователя, чтобы выбрать свои собственные предустановленные вопросы и выбрать предопределенный ответ , Из-за проблем с функциями JS мне пришлось менять имена тегов для предотвращения ошибок функции. Ниже приведен пример моего кода для пользователей, чтобы выбрать их собственные вопросы.

HTML-код в Вопрос Вариант на выбор:

<ul id = "questionChoice1">If I were an animal, what would it be? 
    <li>Horse</li> //The user clicks on li which add's Class "correct" 
    <li>Bird</li> 
    <li>Fish</li> 
    <li>Bear</li> 
</ul> 
Now pick your correct answer & click Save 
<button class="Save">Save</button> 

Javascript для добавления класса к выбранному ответу:

$('li').click(function(){ 
    $('li').removeClass("correct"); 
    $(this).addClass("correct"); 
}); // this gives the span elements the class the user chooses 

Когда пользователь выбирает свой Lī ответ на questionChoice и нажмет кнопку Сохранить I необходимо задать вопрос 1 в разделе основной викторины, чтобы стать следующим:

<p id = "question1">If I were an animal, what would it be? 
    <span class = "correct">Horse</span> 
    <span>Bird</span> 
    <span>Fish</span> 
    <span>Bear</span> 
</p> 

Это i последнее препятствие, которое мне нужно преодолеть, чтобы завершить мой проект. Я просто не знаю, как изменить имена тегов ... любая помощь была бы наиболее оценена. Благодарю.

Answer 1

Существует некоторая полезная библиотека javascript под названием «TweenLite». Используя TweenLite, вы можете изменить все в html, включая теги и классы.

Вот сайт:

http://greensock.com/tweenlite