CODEWITHSUNDEEP
javascriptjqueryhtmlcss
Sheikh Siddiquee
Sheikh Siddiquee

Reputation: 243

How to hide a div using javascript

I want to hide a div using Javascript. Below is my div.

<div class="ui-dialog-titlebar ui-widget-header ui-corner-all ui-helper-clearfix">
<span id="ui-dialog-title-dialog-message" class="ui-dialog-title"> </span>
<a class="ui-dialog-titlebar-close ui-corner-all" href="#" role="button">
<span class="ui-icon ui-icon-closethick">close</span>
</a>
</div>

I tried below javascript, but didnt work.

   $(".ui-dialog-titlebar").css('display','none');

Any idea?

Upvotes: 0

Views: 130

Answers (6)

Bhojendra Rauniyar
Bhojendra Rauniyar

Reputation: 85643

That's not javascript, but jQuery:

You can simply use hide() method:

$(".ui-dialog-titlebar-close").hide(); // you can also use css() method as yours

And you need to wrap your code inside ready handler:

$(document).ready(function(){
//your code here
});

You can learn more about jQuery here.

Upvotes: 2

Suchit kumar
Suchit kumar

Reputation: 11869

you can use you own code as:

$(document).ready(function(){
    $(".ui-dialog-titlebar").css('display','none');

or $(".ui-dialog-titlebar").hide(); });

because before doing all there document should be ready.

Upvotes: 0

HEEN
HEEN

Reputation: 4727

ideally hiding with ID would be more flexible way.

  <div class="ui-dialog-titlebar ui-widget-header ui-corner-all ui-helper-clearfix" id="hidingDiv">
        <span id="ui-dialog-title-dialog-message" class="ui-dialog-title"></span>
        <a class="ui-dialog-titlebar-close ui-corner-all" href="#" role="button">
            <span class="ui-icon ui-icon-closethick">close</span>
        </a>
    </div>

JS code for hiding:-

    $(document).ready(function() {
        $("#hidingDiv").hide();
    });

Upvotes: 1

Sadikhasan
Sadikhasan

Reputation: 18600

Try this

$(document).ready(function(){
    $(".ui-dialog-titlebar").hide();
});

Upvotes: 0

hitesh upadhyay
hitesh upadhyay

Reputation: 264

you have so many ways

$(".ui-dialog-titlebar").hide();
$(".ui-dialog-titlebar").fadeOut();
$(".ui-dialog-titlebar").css('display','none !important');

Upvotes: 2

Ehsan Sajjad
Ehsan Sajjad

Reputation: 62498

Put it in document.ready():

$(function(){

 $(".ui-dialog-titlebar-close").css('display','none');

})

and you can also use hide():

$(function(){

     $(".ui-dialog-titlebar-close").hide();

})

FIDDLE EXAMPLE:

http://jsfiddle.net/qcfdLjr3/

Upvotes: 1

Related Questions