セレクトメニューに応じたdivタグの内容
javascriptの質問です。フォーム内のセレクトメニューに応じて表示する配列を選び、複数のdivタグ内に表示したいと思っています。getElementByIdでセレクトメニューにIdをつけて呼び出し、selectedIndexでfunction()をonloadという事ですすめています。
複数のdivタグ内に書き出すのにinnerHTMLを使うんだなというところまでは理解しているつもりですが、上手く動きませんので、どなたかご存知の方にご教授願えればと思います。
<html>
<head>
<script type="text/javascript">
window.onLoad = function(){
document.getElementById("selected").onChange = function(){
var planTitle = this.selectedIndex;
var object = document.getElementById("derection");
var TextData = [[],["text","text"],["text","text"]];
for (var i=0; i<TextData[planTitle].length; i++){
document.write(TextData[i]);
}
}
}
</script>
</head>
<body>
<form action="">
<select id="selected">
<option value="title01">title01</option>
<option value="title02">title02</option>
<option value="title03">title03</option>
</select>
<div id="direction"></div>
<div id="direction"></div>
</form>
</body>
</html>
お礼
AsarKingChangさん サンプルを拝見して、理解しました。 サンプルは、Vanilla JS で jQueryは無用ですね。 ググリの天才には脱帽しました。 どうもありがとうございました。m(_ _)m