LearnFast.Ninja

jQuery select div within div

If you want to know hot to select div inside another div, you must understand how query in jQuery work. The main idea is to write your the jQuery sign then write your first div name id or class or element then write space and then write the inside div name id etc... Build div with two elements. Call to function that select the div inside My_Div element. Test our complete code.

Step 1: Build div with two elements.

<div id="My_Div" onclick="Show_Divs_Content('My_Div', 'My_Result');">

    <div>Div within div</div>

</div>

Step 2: Call to function that select the div inside 'My_Div' element.

function Show_Divs_Content(Elm_Id, Res_Id) {

    var html = $("#" + Elm_Id + " div").html();

    $("#" + Res_Id).html(html);

}

The main idea is: 

$("#My_Div div")


Complete code:

<html>

<head>

    <title>jQuery select div within div</title>

    <script type="text/javascript" src="http://code.jquery.com/jquery-1.4.4.min.js"></script>

    <script type="text/javascript">

        function Show_Divs_Content(Elm_Id, Res_Id) {

            var html = $("#" + Elm_Id + " div").html();

            $("#" + Res_Id).html(html);

        }

    </script>

</head>

<body>

    <div id="My_Div" onclick="Show_Divs_Content('My_Div', 'My_Result');">

        <div>Div within div</div>

    </div>

    <div style="color: Blue;" id="My_Result"></div>

</body>

</html>


Tags

jquery

jquery-tutorial-for-beginners