<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body> <h1>select an Element By ID</h1> <ul> <li>List 1</li> <li id="second">List 2</li> <li>List 3</li> <li>List 4</li> <li>List 5</li> </ul> <script> let elm = document.getElementById("second"); console.log(elm); // this stores an element as a object, it returns <li id="second">List 2</li> console.log(elm.innerHTML); // this return the value store by an object "List 2" // this method is used to get value elm.innerHTML = "<p>List Modified</p>"; // this method is used to set the value of an object // console.log("This value is After Modifying : " + elm.innerHTML); </script> </body> </html>
Preview:
downloadDownload PNG
downloadDownload JPEG
downloadDownload SVG
Tip: You can change the style, width & colours of the snippet with the inspect tool before clicking Download!
Click to optimize width for Twitter