Get content from id inside id?

Question

I have HTML like:

<div id='content'>
  <div id='price'>$100</div>
  <div id='another'>something</div>
</div>

I can get content from id="content" like.

vl = document.getElementById("content").value;

In this id, I have another id="price". But I cannot get directly content from id="price".

How can I get content from id="price" through id='content'.Thank you.

Answer 1

jQuery:

$("#price").text();

javascript:

document.getElementById("price").innerHTML;

DEMO

Answer 2

You can use as below :

vl = document.getElementById("price").innerHTML;

JSFiddle - Check it out

YOu can also use jquery using .html() or .text() method

Answer 3

Try,

$('#content').html().find('#price').html();

Answer 4

Try this,

var parent = document.getElementById('content');
var childNodes = parent.childNodes;
for(var i = 0, len = childNodes.length;i<len;i++){
    if(childNodes[i].id === "price") {
        alert(childNodes[i].innerHTML);
    }
}

Answer 5

Using jquery,

 $("#content > #price").text();

Answer 6

You can get value of price directly as :

v2 = document.getElementById("price").value;

Answer 7

You need to access the child element through parent element... that is your question right.. i solve it with jquery DEMO

$(document).ready(function(){
  var tem = $('#content').children('#price').text();
    alert(tem);
});

Answer 8

using Jquery,

v1= $('#content').html();
v2=v1.find('#price');
v3=v1.find('#another')

Answer 9

IDs should only be used when there is one of that item on the page. You will have no other chance as to re-assign your IDs, or alternatively using the class attribute.

Try this way to select,

var vl = document.getElementById("content").getElementsByClassName("price")[0];

HTML

 <div id='content'>
   <div class='price'>$100</div>
   <div class='another'>something</div> 
 </div>

Answer 10

Try this out:- http://jsfiddle.net/adiioo7/C3C4x/1/

var price = document.querySelector("#content #price").innerHTML;

console.log(price);