Javascript Reference - HTML DOM Li Object

The Li object represents an HTML <li> element.

Li Object Properties

Property	Description
value	Sets or gets the value of the value attribute

Standard Properties and Events

The Li also supports the standard properties and events.

Example

The following code shows how to get a <li> element by using getElementById()


<!DOCTYPE html>
<html>
<body>
<ol>
  <li id="myLi">A</li>
  <li>B</li>
  <li>C</li>
  <li>D</li>
</ol><!--  w w w.  java  2 s  . co  m-->
<button onclick="myFunction()">test</button>
<script>
function myFunction() {
    var x = document.getElementById("myLi");
    x.value = "300";
}
</script>
</body>
</html>

The code above is rendered as follows:

Example 2

The following code shows how to create a <li> element by using the document.createElement() method.


<!DOCTYPE html>
<html>
<body>
<ol id="myList">
  <li>A</li>
  <li>B</li>
  <li>C</li>
</ol><!--   w w w.ja v a2 s  .  c  o m-->
<button onclick="myFunction()">test</button>
<p id="demo"></p>
<script>
function myFunction() {
    var x = document.createElement("LI");
    var t = document.createTextNode("D");
    x.appendChild(t);
    document.getElementById("myList").appendChild(x);
}
</script>
</body>
</html>

The code above is rendered as follows: