CODEWITHSUNDEEP
javascriptjqueryjquery-selectors
R1234
R1234

Reputation: 484

Selecting a division based on what division it using Jquery

<div class = ui-dialog-abc ui-dialog-xyz>
<div id = "sheet1abc">
</div>
</div>

<div class = ui-dialog-abc ui-dialog-xyz>
<div id = "sheet1xyz">
</div>
</div>

<div class = ui-dialog-abc ui-dialog-xyz>
<div id ="sheet2foo">
</div>
</div>

<div class = ui-dialog-abc ui-dialog-xyz>
</div>

Can I select a div based on what div it contains? I want to make the div containing the div whose id contains sheet1 visible or hidden.

Upvotes: 1

Views: 141

Answers (3)

James Allardice
James Allardice

Reputation: 165971

If I've understood you correctly, you are looking to select the div that is a parent of a div with an id beginning with "sheet1".

If that's correct, you can do the following:

$("div[id^=sheet1]")

That will select all div elements with an id beginning with "sheet1". You can then loop through the set of elements using each and get the parent of each element to access the parent div.

Once you have the parent div, you can show/hide it using show or hide.

See an example fiddle in which I alert the id of the each matching parent div.

Update

If the child div you are looking for is not a direct child of the ancestor div, you can use parent().closest('div') to climb the DOM tree to find the first ancestor div of the div with your id.

The question asks to get the "div containing the div...", so this method will get the first ancestor div. See this fiddle, in which the child div is contained within a table.

Upvotes: 5

searlea
searlea

Reputation: 8378

Grab all divs whose ids contain 'sheet1', then grab their closest containing div:

$('div[id*=sheet1]').map(function() {
    return $(this).parents('div:first')[0] 
});

Upvotes: 0

Naveed
Naveed

Reputation: 42093

$('div').has('div[id="sheet1abc"]').text();
$('div').has('div[id="sheet1xyz"]').text();

Upvotes: 1

Related Questions