循環通過替代文本的onclick

Question

完全是個新手，試圖創建一個個性化的聖經，在這裏用戶可以通過單獨的詞/詞組的其他翻譯週期通過點擊直接在所述詞/詞組。我知道我可能需要某種形式的「for循環」的功能，但我希望存儲自己的喜好（如字符串？）緩存和用戶配置文件，所以文本不應該重置爲在頁面加載默認。理想情況下我會嵌入HTML所述替代文本選項（「陣列」？），如下，同時保持HTML作爲整潔越好。 JS最終會被成千上萬的ID，每聖經詩句大概有，所以更普及的腳本，更好的填充。提前致謝！

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.js"></script> 
<script> 
$(document).ready(function() { 
    $('.alternate').click(function() { 
     $('#1Cor13-4a').text('[What goes here if I want to cycle through the options listed in HTML?]'); 
     $('#1Cor13-4b').text('[Ditto]'); 
    }); 
}); 
</script> 

My <span class="alternate" id="1Cor13-4a" onclick="ChangeText({"care","love"})">love</span><span class="alternate" id="1Cor13-4b" onclick="ChangeText({"is patient with","suffers long for"})">is patient with</span> you. 

Answer 1

使用數據 - 屬性...

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.js"></script> 
<script> 
$(document).ready(function() { 
$('.alternate').click(function() { 
     var index= $(this).attr("data-text-index"); 
    var text = $.parseJSON($(this).attr("data-text")); 
    if(index== null) 
     index = -1; 
    index = Number(index)+1>=text.length? 0:Number(index)+1; 
    $(this).html(text[index]); 
    $(this).attr("data-text-index",index); 
    }); 
}); 
</script> 
My <span class="alternate" id="1Cor13-4a" data-text='["care","love"]'>love</span><span class="alternate" id="1Cor13-4b" data-text='[" is patient with"," suffers long for"]'> is patient with</span> you.