How to show/hide a span using javascript

Question

Can someone show a way to show/hide a span using javascript

 document.getElementById("test").style.display= 'visible';
 document.getElementById("test").style.display= 'block';

In the HTML Code

<span id='test' ..

How can I overcome this problem. Is there any thing that I should think about?

UPDATE I have a class like this one, I want to force mouse hovering on it.

<div id="test" class="tooltip effect">
        <div id="second" href="#"> .. </div>

On css:

tooltip{..}
effect{..}
effect:hover{..}

Another option I tried besides your code is

document.getElementById("test").onmouseover = test.hover;

• Should I re-write the hover class to another name-class, or should I tweak your code?

Answer 1

Use display none/default:

document.getElementById("test").style.display= 'none';
document.getElementById("test").style.display= '';

Below are some types and some easy to remember rules about them:

Default: the elements default property (generally block or inline)

Block: Generally on a line by itself. Has the width and height attributes (among other size/positioning attributes)

inline: on the same line as other elements/text. Does not have height/width attributes

Inherit: Inherits the parent element's display type

Answer 2

visible isn't a value for the display, you want none