How to show all nested DIVs inside the main DIV with a title tag?

I have my main divs title="apple"and nested divs without a title tag. When I write code to show the main div with a title "apple", only the main divone is displayed, nested divs are not displayed. How to display all child divs even if they don't have a title tag? Here is the code below.

<div title="apple">
  <div>Hi..</div>
</div>

And jQuery

$('input#showapple').click(function(){
  $("div *[title='apple']").show(2000);
});

$('input#hideapple').click(function(){
  $("div *[title='apple']").hide(2000);
});
+5
source share
4 answers

You can make them as one, using the toggle plus , you do not need to specify an argument inputwhen choosing by identifier, jQuery returns only the first matched element on the ID (because there should be only one):

$('#showapple, #hideapple').click(function(){
    $("div[title='apple'] > div").toggle(2000);
});
+4
<div id="apple">

, , .

0

Try:

$('input#showapple').click(function(){
   $("div[title='apple'] > div").show(2000);
});

div apple div .

http://jsfiddle.net/rpZbL/

0
source

your selector seems to be off a bit

$('input#showapple').click(function(){
    $("div[title=apple]").show(2000);
});

In addition, you really should use classes for this, and not for the name.

0
source

All Articles