Find UL from div

Question

I have a div "editableDiv" which is nested inside another div. editableDiv has an unordered list as its child item. Please go through the code

<div>
    <div id="editableDiv" contenteditable="true">
        <ul id="suggestUL"></ul>
    </div>
</div>

Question is, how to find the innermost ul suggestUL

Thanks in advance.

you have only one UL, and that UL is given an id. Whats the issue here? — He Hui, Dec 18 '13 at 12:38

score 5 · Answer 1 · answered Dec 18 '13 at 12:38

5

You can get ul directly through id using id selector as id is supposed to be unique but you can use descendant selector as well

Using id selector

$('#suggestUL')

Use descendant selector

$('#editableDiv ul');

answered Dec 18 '13 at 12:38

Adil

146,340
25
209
204

score 1 · Answer 2 · answered Dec 18 '13 at 12:39

1

Also using .find()

$('#editableDiv').find('ul');

answered Dec 18 '13 at 12:39

Praveen

55,303
33
133
164

score 1 · Accepted Answer · answered Dec 18 '13 at 12:40

1

1) you can find it by ID ( which should be unique).

$('#suggestUL');

2) assuming there is no ID and you want to find the innermost UL :

how to find the innermost ul

<div>
    <div id="editableDiv" contenteditable="true">
        <ul ></ul>
    </div>
</div>

Try this :

$('#editableDiv ul:last');

answered Dec 18 '13 at 12:40

Royi Namir

144,742
138
468
792

<- Thanks. And now, How can I set its (**suggestUL**) css attributes. My code seems to be not working. Here it is `$('#suggestUL').css('left', pos.left + 'px'); $('#suggestUL').css('top', pos.top + 'px');` – Basavaraj Metri Dec 18 '13 at 13:04
1

@BasavarajMetri How do you calculate `pos` ? ( and what `position` you have on it) – Royi Namir Dec 18 '13 at 13:05
Oh, sorry, I got it. Had problem in `'pos.left'` and `pos.top`, fixed. Thanks Royi. – Basavaraj Metri Dec 18 '13 at 13:09

score 1 · Answer 4 · edited May 23 '17 at 12:28

1

Most proper way to find ul element inside of div with jQuery is as following:

$('div#editableDiv').find('ul')

Read about selector performance related information from here.

edited May 23 '17 at 12:28

Community

1
1

answered Dec 18 '13 at 12:40

Khamidulla

2,927
6
35
59

score 1 · Answer 5 · answered Dec 18 '13 at 12:45

1

You can find out this by way, using div id .

$(document).ready(function(){
$("#editableDiv").find('ul');
    $("#editableDiv").find('ul').text("sss");
    console.log($("#editableDiv").find('ul'));
})

Demo

answered Dec 18 '13 at 12:45

Zeeshan

1,659
13
17

score 1 · Answer 6 · answered Dec 18 '13 at 12:46

Because you have tagged this question with css I thought I would add an answer showing you that you can style it simply in css like this..

#suggestUL { // Your Styling } or #editableDiv ul { // Your Styling }

It depends what you want to do with the UL, your question of 'how to find the innermost ul' could be interpreted in a few ways.. perhaps you should consider improving your question?

Find UL from div

6 Answers6