jqueryでクイズを作成
jqueryでクイズを作っているのですが、下のプログラムのような問題を書く部分(問題1、問題2...)のところに改行などを用いた長い文章を書きたいのですがどのようにしたらよいでしょうか？
// answers の先頭が正答になるようにして下さい。選択肢はシャッフルして表示されます。
var questions = [
{'question': '問題1', 'answers': ['富士山', '愛鷹山', '天保山', '八ヶ岳']},
{'question': '問題2', 'answers': ['バラ', 'チューリップ', 'タンポポ', '百合']},
{'question': '問題3', 'answers': ['あららぎ', 'せんじょうがはら', 'せんごく', 'かんばる']},
{'question': '問題4', 'answers': ['宇宙人', '異世界人', 'ドイツ人', '未来人']}
];
Array.prototype.shuffle = function() {
var i = this.length;
while(i){
var j = Math.floor(Math.random()*i);
var t = this[--i];
this[i] = this[j];
this[j] = t;
}
return this;
};
var answers = [];
var current_question_number;
$.each(questions, function (i, question) {
question.true_answer = question.answers[0];
question.answers.shuffle();
});
$(function() {
showQuestion(0);
$('#answer_button').click(function () {
var answer = -1;
$.each($('#answers input'), function (i, value) {
if ($(value).is(':checked')) {
answer = i;
return false;
}
});
if (answer == -1) {
$('#warning').slideDown();
return false;
}
$('#warning').slideUp();
answers[current_question_number] = questions[current_question_number].answers[answer];
if (current_question_number < questions.length - 1) {
showQuestion(current_question_number + 1);
} else {
showResult();
}
});
});
function showQuestion(question_number) {
current_question_number = question_number;
var question = questions[question_number];
$('#question_number').text((question_number + 1) + "/" + questions.length);
$('#question_body').text(question.question);
$('#answers').empty();
$.each(question.answers, function (i, value) {
$('#answers').append($('<li/>').append($('<input type="radio" name="answer" id="answer' + i + '"/>')).append($('<label for="answer' + i + '"/>').text(value)));
});
}
function showResult() {
$('#question_view').hide();
$.each(questions, function (i, question) {
var is_true = answers[i] === question.true_answer;
$('#results').append($('<tr/>')
.addClass(is_true ? 'true' : 'false')
.append($('<th/>').text(i + 1))
.append($('<td/>').text(answers[i]))
.append($('<td/>').text(question.true_answer))
.append($('<td/>').text(is_true ? '○' : '×'))
);
});
$('#result_view').show();
}
お礼
ご回答ありがとうございます。 ＞『質問の順番はそのままでよくて、答えの選択肢の順番をランダムに入替えたい』ってことでしょうか？ その通りです。 わかりづらくて申し訳ありませんでした。 とりあえず、シャッフルでやってみたいと思います。
補足
シャッフルで解決しましたので、ベストアンサーとさせていただきます。