why does [style.display = '']' only work with inline css?

[nickdclements]

If you use 'inline CSS' to hide a div, you can display it with Javascript.

<a href="#" onClick="document.getElementById('mydiv').style.display = '';">show</a>
<div id="mydiv" style="width:100px; height:100px; border:dashed 1px #FF6600; display:none;">
</div>

If you hide it with a 'CSS class/ID Selector' Javascript will not work to display it.

<style type="text/css">
#mydiv {display:none;}
</style>
<a href="#" onClick="document.getElementById('mydiv').style.display = '';">show</a>
<div id="mydiv" style="width:100px; height:100px; border:dashed 1px #FF6600;">
</div>

I suppose I can see/understand why... all the same is there any way around it?

Thank you!

 

[nickdclements]

Got it. DISPLAY = 'BLOCK'

I should probably start using 'block' over '' anyway >.<