JS - Element properties

Coffee
Tea

The HTML content of the list's last child node is:

Whitespaces between elements are considered text nodes.

If you add whitespace before the closing /ul tag, the result will be "undefined".

Click the button to get the text of the last child node of the select element.

Select

            <div>
                <ul id="myList"><li>Coffee</li><li>Tea</li></ul>
                <p>The HTML content of the list's last child node is: <span id="prop"></span></p>
                <p style="font-size:0.9vw;">Whitespaces between elements are considered text nodes.</p>
                <p style="font-size:0.9vw;">If you add whitespace before the closing /ul tag, the result
                 will be "undefined".</p>
                <p style="font-size:0.9vw;">Click the button to get the text of the last child node of 
                the select element.</p>
                <p><button onclick="firstFunction()">try it</button></p>
                <label for="mySelect">Select</label>
                <select id="mySelect" size="4"><option>Audi</option><option>BMW</option>
                <option>Saab</option><option>Volvo</option></select>
                <p id="prop1"></p>
            </div>
            <script>
                let text = document.getElementById("myList").lastChild.innerHTML;
                document.getElementById("prop").innerHTML = text;
                function firstFunction() {
                    let text = document.getElementById("mySelect").lastChild.text;
                    document.getElementById("prop1").innerHTML = text;
                }
            </script>

Second child in div

Fourth child in div

The node name of "DIV"'s last child node is.

Whitespaces inside elements are considered text nodes. In this example, the first, third and fifth child of "myDIV" is a #text node.

            <div>
                <div id="DIV">
                    <p>Second child in div</p>
                    <p>Fourth child in div</p>
                </div>
                
                <p>The node name of "DIV"'s last child node is.</p>
                <p id="prop2"></p>
                
                <p>Whitespaces inside elements are considered text nodes.
                In this example, the first, third and fifth child of "myDIV" is a #text node.</p>
      
            </div>
            <script>
               let text1 = document.getElementById("DIV").lastChild.nodeName;
               document.getElementById("prop2").innerHTML = text1;  
            </script>

Click the button to get the node name of the DIV's last child node.

A P element - First child in div

A Span element - Last child in div

            <div>
                <p>Click the button to get the node name of the DIV's last child node.</p>
                <div id="DIV1"><p>A P element - First child in div</p><span>A Span element - 
                Last child in div</span></div>                
                <button onclick="secondFunction()">Try it</button>
                <p id="prop3"></p>
            </div>
            <script>
                function secondFunction() {
                    var x = document.getElementById("DIV1").lastChild.nodeName;
                    document.getElementById("prop3").innerHTML = x; 
                }
            </script>

JS - element properties - lastChild

returns the last child node of an element.