特定の要素内に入力された文字列を改行<br />ごとに置換することはできますか？

ある要素内（div id="hoge")に入力されている文字列をセレクトボックスに置換することはできるでしょうか？

<div id="hoge">
会議室A<br />会議室B<br />会議室C<br />
</div>

上の<div id="hoge">要素を下記のように変更したいと思っております。
<br />を区分けの基準にして<br />自体は削除した形で置換できればと思います。

<div id="hoge">
<select name="room">
<option value="会議室A">会議室A</option>
<option value="会議室B">会議室B</option>
<option value="会議室C">会議室C</option>
</select>
</div>

上記のようなことは可能なのでしょうか？
可能であればご教授お願いいたします。

質問者からの補足コメント

• ご回答ありがとうございます。
  
  ＞元のHTMLを手で直したほうが良いのでは？
  
  説明が足りませんでした。
  もともとHTMLに記述されている文字列を置換するわけではありません。
  プログラムを利用してデータベースから文字列を表示させるようになっています。
  そのため元のHTMLには文字列が記述されていません。
  
  ＞javascriptで変換したセレクトボックスなんて怖くて使えないと思います。
  
  一時的な対応策のために簡易的に利用したいと考えております。
  
  置換方法をご存知でしたらば教えていただけると助かります。
  よろしくお願いいたします。

  No.1の回答に寄せられた補足コメントです。 補足日時：2016/11/18 23:06

No.2 ベストアンサー 回答者： yambejp 回答日時： 2016/11/18 23:25

とりあえずどうしてもということなので

<script>
window.onload=function(){
var hoge=document.getElementById("hoge");
var s=document.createElement("select");
s.setAttribute("name","room");
while(n=hoge.firstChild){
if(n.nodeName=="#text" && n.nodeValue!=="\n"){
var o=document.createElement("option");
o.setAttribute("value",n.nodeValue);
o.appendChild(document.createTextNode(n.nodeValue));
s.appendChild(o);
}
hoge.removeChild(n);
}
hoge.appendChild(s);
}
</script>
<div id="hoge">
会議室A<br />会議室B<br />会議室C<br />
</div>

この回答へのお礼

迅速なご回答をいただきありがとうございました。
また、こちら側でテストができずにいた関係でお礼が遅くなり申し訳ありませんでした。

教えていただいた方法で期待通りの動きをしてくれました。
一時的に置換が必要な状況となり、どうしようかと困っていたので助かりました。
ありがとうございました。

お礼日時：2016/11/19 10:58

No.1 回答者： yambejp 回答日時： 2016/11/18 21:04

できないことはないですが、元のHTMLを手で直したほうが良いのでは？

javascriptで変換したセレクトボックスなんて怖くて使えないと思います。