How do I check the type of a child inside a div?

Question

I want to check the type of an element which is placed inside a div. I'm not able to reference the child element. I have tried using the following:

$("#"+styleTarget).siblings(0).get(0)tagName

Where styleTarget is a variable holding the id of the parent div.

Answer 1

Hi there.

I think you need to be looking at the children() function, unless you want to only look at a specific item, then, as GenericTypeTea suggested, use the :first-child or nth-child selectors.

http://api.jquery.com/children/

Cheers.

Answer 2

You can get it like this:

var tagName = $("#"+styleTarget+" *")[0].tagName; //or...
var tagName = $("#"+styleTarget+" :first-child")[0].tagName;

The important part is the space between the selectors.

Answer 3

There's difference between a child and a sibling. In the example below, all the <li> are childrens of <ul>. Each <li> is a sibling of all of the other <li> elements, because they are on the same level in the DOM tree.

<ul class="parent">
  <li>List 1</li>
  <li>List 2</li>
  <li>List 3</li>
</ul>

You should be using .children(), as documented here http://api.jquery.com/children/.

$("#"+styleTarget).children().get(0).tagName