Jquery hide is not working

I am using the below code,

HTML code,

<p>This is a paragraph.</p>
<p>This is another paragraph.</p>
<div id="one" class="two">HI W开发者_如何学运维ELCOME TO RESOURCESUITES.COM</div>
<button>Click me</button>

Jquery code,

$(document).ready(function(){
     $("button").click(function(){
        $("div#one .two").hide();
     });
   });

• the above code is not working.the div is not hiding.

By separating #one and .two by a space, you are addressing a div with the class "two" that is a child of #one.

Remove the space:

$("div#one.two").hide();

however,

$("#one").hide();

would do already: IDs have to be unique anyway. There is no need to add the .two to the selector.

It should be

$("div#one.two").hide()

"div#one .two" means elements with class="two" which are descendants of div with id="one"

When you know the id of an object you do not need the class or type.

$(document).ready(function(){
     $("button").click(function(){
        $("#one").hide();
     });
   });

$("div#one .two").hide();

You dont need the class name. div#one is enough to identify the element. If you want to keep the class name, just remove the space so the selector is div#one.two

Your selector is wrong. Use

$(document).ready(function(){
     $("button").click(function(){
        $("div#one").hide();
     });
   });

$("div#one.two").hide(); no space needed in between a better alternative will be

 $("div.two").hide();

or

 $("#one").hide();