ブラウザのよくわからない挙動

#どんな挙動？

tr,th,tdが消滅してしまう

#状況

テンプレートとして用意したタグの中から

tr,th,tdタグがすっぽり消滅してしまう

##例

ソース

<table>
 <tbody>
 </tbody>
</table>

<div id="template">
 <tr>
  <th>日付</th>
  <td><a href="http://map.html">場所</a></td>
  <td>
   <p>注意事項</p>
  </td>
 </tr>
</div>

ブラウザ上

<div id="template">
  <a href="htpp://map.html">場所</a>
  <p>注意事項</p>
</div>

なぜかtr,th,tdが無くなっている

#解決策

1. id templateのタグをdivではなくtableにする

<table id="template">
 <tr>
  <th>日付</th>
  <td><a href="http://map.html">場所</a></td>
  <td>
   <p>注意事項</p>
  </td>
 </tr>
</table>

これで意図通りに動いてくれました。

#あとがき

頻繁にとは言わないけれど、それなりに使う状況ありそうなものだけれど、この挙動についての記事を探してみたけれど見当たらず
みんな躓かないのかな～？
こんなことで３時間も潰してしまったので３年ぶりに吐き出してみました。
３年前とあまり書いているレベルが変わっていないような＾＾；
それでもまあ開発は順調に進んでいます。

初めはjQuery.clone()不具合のような記事を書きましたが
@nishimura さんにご指摘いただきブラウザの挙動によるものとわかり全体的に修正を入れてあります。

@nishimura さん
ありがとうございました！