JAVAでselect の選択肢の値によって 次のselect の選択を可変にしたい時の最初がエラーになる

実現したいこと

JAVAで1段目のselect の選択肢の値によって　2段目のselect の選択を可変にしたいのですが、
そのページに最初に行った時がエラーになります。
最初だけ、2段目のselect が全部表示されます。
1段目を何か選ぶと、次からは、それに連動した2段目のselectになります。
このエラーを解決したいです。
よろしくお願いします。

発生している問題・分からないこと

1 ページをリフレッシュすると、
上の選択画面に　果物市場　が現れ、
その下に横一列に
<select id="果物市場" class="good" name="good"><option value=バナナ>バナナ<option value=いちご>いちご<option value="新果物">--新果物--</option></select>

<select id="魚市場 class="good" name="good"><option value=たい>たい<option value=ヒラメ>ヒラメ<option value="新魚">--新魚--</option></select>

<span id="新品 class="good"><input type="text" name=newgood placeholder="新商品" size="15"></span>
が並びます。
2 次に、上のselectで　魚市場　を選ぶと
その下に、たい、ヒラメ、--新魚--が選べるようになります。
しかし、<input type="text" name=newgood placeholder="新商品" size="15">
は消えます。

3 その後は上のselectで　果物市場　を選ぶと
バナナ、いちご、--新果物--　が選べます。
同様に<input type="text" name=newgood placeholder="新商品" size="15">
は出てきません。

エラーメッセージ

error

1特にエラーメッセージは見えません。

該当のソースコード

java

1<script type="text/javascript">2NodeList.prototype.hide=function(){3 Array.prototype.map.call(this,function(i){4 i.style.display = 'none';5 });6};7HTMLElement.prototype.show=function(){8 this.style.display = 'inline';9};10window.onload=function(){11 document.querySelector(".market").addEventListener('change',function(e){12 var p=e.target.parentNode;13 p.querySelectorAll(".good").hide();14 p.querySelector("#" + e.target.value).show();15 16 });17 if(document.createEvent){18 var e=document.createEvent('pulldownset');19 e.initEvent("change",true,true); 20 }else{21 var e=new Event("change");22 }23 document.querySelector(".market").dispatchEvent(e);24}25</script>

html

1<div class="pulldownset">2<select class="market" name=market><option value=果物市場>果物市場</option><option value=魚市場>魚市場<option><option value="新market">--新規market--</option></select>3<br><select id="果物市場" class="good" name="good"><option value=バナナ>バナナ<option value=いちご>いちご<option value="新果物">--新果物--</option></select><select id="魚市場" class="good" name="good"><option value=たい>たい<option value=ヒラメ>ヒラメ<option value="新魚">--新魚--</option></select><span id="新品" class="good"><input type="text" name=newgood placeholder="新商品" size="15"></span>4</div>

試したこと・調べたこと

上記の詳細・結果

それぞれの行を削除してみたり、適当に書き換えたりしましたが、
どこまでが変数なのか関数なのかがわからず、お手上げです。

補足

特になし