javascript - get outer div by id, then get inner div by class

Question

First I want to get the outer div by id, then the inner div by class (dynamically added by jquery mobile ui-collapsible content) and finally append a child text node to it.

<div id="aab" data-role="collapsible" data-content-theme="c">
     <h3>Heading</h3>
     <div class="ui-collapsible-content">
         <div id="coll">
             Collapsible Content
         </div>
     </div>
     </div>
     <p><button onclick='func()'>Button</button></p>    

   <script>
        function func() {
            var section = $("#aab > .ui-collapsible-content"); 
            section.appendChild(document.createTextNode("Hello world!"));
        }
    </script>

I also tried things out with document.getElementById but somehow it doesn't work.. Thanks in advance!

Answer 1

您已使用 jquery 进行选择，因此您应该使用它来添加子项

function func() {
  var section = $("#aab > .ui-collapsible-content"); 
  section.append("Hello world!");
}