I'm encountering an issue with my HTML and jQuery code. Here is what I have:
<div id="block1">
some text
</div>
<div id="block2">
some more text
</div>
Along with the following piece of jQuery code:
jQuery(document).ready(function($) {
$('block1').css('display', 'block');
$('block2').css('display', 'none');
});
The goal here is to display block1 and hide block2. However, in IE, both DIVs briefly appear before only displaying the correct one (block1). This problem doesn't occur in Chrome, Firefox, etc...
Due to the dynamic generation of the HTML code, I am unable to directly add style attributes such as "display: block;" and "display: none;". Are there any alternative solutions using jQuery that would work consistently across all browsers?