Random order of elements
Random order of elements
So, I have a document like this (leaving the formal body and head tags out):
- <ul>
- <li>Listitem #1</li>
- <li>Listitem #2</li>
- <li>Listitem #3</li>
- <li>Listitem #4</li>
- <li>Listitem #5</li>
- </ul>
Now my plan was to make the order of the <li> elements random, so that at certain times it appears like this
- <ul>
- <li>Listitem #4</li>
- <li>Listitem #2</li>
- <li>Listitem #5</li>
- <li>Listitem #1</li>
- <li>Listitem #3</li>
- </ul>
or like this:
- <ul>
- <li>Listitem #3</li>
- <li>Listitem #2</li>
- <li>Listitem #1</li>
- <li>Listitem #5</li>
- <li>Listitem #4</li>
- </ul>
and so on...
I tried to achieve this with this mixture of JavaScript and JQuery:
- <script src="http://code.jquery.com/jquery-1.4.2.min.js" type="text/javascript" />
<script language="JavaScript">
$(document).ready(function() {
for (i = 0; i > document.getElementsByTagName('li').length; i++) {
number = Math.round(Math.random() * 957834582384299) % document.getElementsByTagName('li').length;
$('li:nth-child(' + i + ')').append($('li:nth-child(' + number + ')'));
$('li:nth-child(' + number + ')').remove();
}
}
)
</script>
But trying to load the HTML it didn't work. Would you be able to explain me why and how this problem could be fixed? I have tried several alternatives, checked the error console all the time, but they all failed as well. Thanks.