<
body
>
<
h1
style="text-align:center;
color: forestgreen;">
GeeksForGeeks
</
h1
>
<
p
style="text-align:center; font-size: 15px;
font-weight: bold;">
Click on the button to sort the list
</
p
>
<
ul
style
=
"color: crimson;"
id
=
"GeekList"
>
<
li
>Geeks</
li
>
<
li
>For</
li
>
<
li
>GFG</
li
>
<
li
>GeeksForGeeks</
li
>
</
ul
>
<
br
>
<
center
>
<
button
style
=
"color: crimson;"
onclick
=
"sort()"
>
Click Here To Sort
</
button
>
</
center
>
<
script
>
function sort() {
// Declaring Variables
var geek_list, i, run, li, stop;
// Taking content of list as input
geek_list = document.getElementById("GeekList");
run = true;
while (run) {
run = false;
li = geek_list.getElementsByTagName("LI");
// Loop traversing through all the list items
for (i = 0; i < (li.length - 1); i++) {
stop = false;
if (li[i].innerHTML.toLowerCase() >
li[i + 1].innerHTML.toLowerCase()) {
stop = true;
break;
}
}
/* If the current item is smaller than
the next item then adding it after
it using insertBefore() method */
if (stop) {
li[i].parentNode.insertBefore(
li[i + 1], li[i]);
run = true;
}
}
}
</
script
>
</
body
>