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

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 work. Is the method I'm using valid or is there an other way to get the result?

You should remove "style" attribute instead of "display" property :

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

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();

If you are planning to hide show some span based on click event which is initially hidden with style="display:none" then .toggle() is best option to go with.

$("span").toggle();

Reasons : Each time you don't need to check whether the style is already there or not. .toggle() will take care of that automatically and hide/show span based on current state.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>_x000D_
<input type="button" value="Toggle" onclick="$('#hiddenSpan').toggle();"/>_x000D_
<br/>_x000D_
<br/>_x000D_
<span id="hiddenSpan" style="display:none">Just toggle me</span>

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

or..

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

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!