JQuery Programmatically adding articles

I am trying to programmatically add articles to my website and then add a random word to each article using Jquery. I am able to make all the articles but I am not able to add text to the articles. Here is my code:

<!DOCTYPE html>

<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script src="http://code.jquery.com/jquery-2.1.0.min.js" type="text/javascript"></script>
    <script src="Script/jquery.lorem.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(document).ready(function ()
        {
            var colors = ["#CCCCCC", "#333333", "#990099"];
            var rand = Math.floor(Math.random() * colors.length);

            $(function () {
                for (var i = 0; i < Math.floor((Math.random() * 64) + 34) ; i++) {
                    $("#Inferface").append("<article class='box' style='background-color:" + colors[rand] + "'><span>" + i + "</span>");
                }
            });
            // This line below should be adding the random word to each of the articles

            $('.box').lorem({ type: 'words', amount: '1', ptags: false });
        });

    </script>
</head>
<body id="Inferface">
</body>
</html>

Answers


Strange, It seems to me that the code is working with very few adjustments

$(function ()
{
        var colors = ["#CCCCCC", "#333333", "#990099"];
        var rand = Math.floor(Math.random() * colors.length);

        for (var i = 0; i < Math.floor((Math.random() * 64) + 34) ; i++)
        {
           $("#Interface").append("<article class='box' style='background-color:" + colors[rand] + "'><span>" + i + "</span>");
        }
        // This line below should be adding the random word to each of the articles
        $('.box').lorem({ type: 'words', amount: '1', ptags: false});
});

.. you can check it out here : Working Example


Need Your Help

How to Trigger LinkButton Postback after Confirmation using jQuery UI Dialog?

javascript jquery jquery-ui webforms jquery-ui-dialog

I want a LinkButton to popup a jQuery UI dialog that prompts the user to confirm the action. If the user hits OK, then I'd like the action to continue by posting back to the server.