remove attribute display:none; so the item will be visible

Question

The element is :

span    {
    position:absolute;
    float:left;
    height:80px;
    width:150px;
    top:210px;
    left:320px;

    background-color:yellow;

    display:none;                 //No display                  
    border: 3px solid #111;
}

i use this code to remove the display so it can be visible

                $("span").removeAttr("display");

but it does not works...is the method im using valid ? or is there an other way to get the result ?

Answer 1

$('#lol').get(0).style.display=''

or..

$('#lol').css('display', '')

Answer 2

For this particular purpose, $("span").show() should be good enough.

Answer 3

The removeAttr() function only removes HTML attributes. The display is not a HTML attribute, it's a CSS property. You'd like to use css() function instead to manage CSS properties.

But jQuery offers a show() function which does exactly what you want in a concise call:

$("span").show();

Answer 4

The jQuery you're using is manipulates the DOM, not the CSS itself. Try changing the word span in your CSS to .mySpan, then apply that class to one or more DOM elements in your HTML like so:

...
<span class="mySpan">...</span>
...

Then, change your jQuery as follows:

$(".mySpan").css({ display : inline });

This should work much better.

Good luck!