for文をonclickで順番に実行できない

Question

会話形式で、会話が何種類かあり、クリックするたびに表示。としたいのですが、配列最後のもの（お）しか表示されません。

function talk_house() {
  var talks_house_stock = ["あ","い","う","え","お"];
  for (var i=0;i<talks_house_stock.length;i++){
  document.getElementById("window_h").innerText = talks_house_stock[i];
}
}

<button onclick="talk_house()" class="talk_house main_touch">話す</button>

解決後に失礼します。
解決はしましたが、参考のためにfor文での実現方法についてもご教示いただけますと幸いです。

Comments

[miyabi_pudding]

タイプライター風に文字を順番に増やしたいということですか？
要件を明確にお願いします。

[chinki]

質問があいまいで失礼いたしました。解決いたしました。

Answer 1

function talk_house() {
  var w=document.getElementById("window_h");
  var str=w.textContent;
  var t= ["あ","い","う","え","お"];
  w.textContent= t[t.indexOf(str)+1]||"";
}

Comments

[chinki]

早速ありがとうございました。とても助かりました。

Answer 2

クリックしたときに、

"あ"を表示する
↓
"あ"が表示されているところに、上書きで"い"を表示する
↓
"い"が表示されているところに、上書きで"う"を表示する
↓
：
"え"が表示されているところに、上書きで"お"を表示する

……という処理が実行されるから最後の"お"しか表示されません。

クリックするたびに表示

が具体的にどのような動きになるかは質問者さんが決めることなので、回答できませんが「配列の何番目まで表示したか」を保存する変数をつかうことになると思います。

Comments

[chinki]

早速ありがとうございます。補足させていただきます。
一度クリック→あ
もう一度クリック→い
…最後にお
という動きにしたかったのでした。