Question

How to output a particular JQuery array into a particular Div. For example I want to pull the (phrases[0]) array into Div id=”div01″, and the (phrases[1]) array into Div id=”div02″. I have read up all the functions of JQuery but can’t find this.

var phrases = [
['nihao', 'orange', '你 好', 'hello'],
['zaijian', 'red', '你 好', 'goodbye']
];

makePhrase = function(phrase){
var div = $('<div class="word"><span class="pinyin">' +phrase[0]+ '</span><br/><span class="chinese">'     +phrase[2]+ '</span><br/><span class="english">' +phrase[3]+ '</span> </div>');

And then I need a line to say (in effect):

.append makePhrase( phrases[0] ) to Div id=”div01″

but do not know the correct method. This is only my second day of learning JQuery so I would appreciate a spell-it-out answer which then I can learn more from through further investigation! I hate being the noob but any help would be appreciated.

Answer 1

You are very close; Try this:

var phrases = [
    ['nihao', 'orange', '你 好', 'hello'],
    ['zaijian', 'red', '你 好', 'goodbye']
    ];

makePhrase = function(phrase) {
    var div = '<div class="word"><span class="chinese">Chinese: ' + phrase[0] + '</span><br/><span class="pinyin">Pinyin:' + phrase[2] + '</span><br/><span class="english">English: ' + phrase[3] + '</span> </div>';
    return div;
}

$("#div01").append(makePhrase(phrases[0]));
$("#div02").append(makePhrase(phrases[1]));​

And proof it works over at jsfiddle: http://jsfiddle.net/SKssF/14