Never define blank div as <div id=”dv”/>

Today, I came across an interesting behavior of div. It may be well-known to everyone but new to me. I needed a blank div. I wanted to set the InnerHTML of the div from javascript. Instead of end tag, I declared the div as <div id=”dv”/>

No wonder, I can access the div from Javascript. When I assign anything (say “Test”) into innerHtml of the div, the html below the div is replaced by the “Test”. However, if you declare the div as <div id=”dv”></div>, it will work as expected. 

Therefore, we should always use end tag of div.

Hope this helps to someone!