how to create Dynamic SlideShow with Orbit Plugin

Question

i want create Dynamic Slideshow in Jquery i'm Write this code

 var ctx = new DynamicSlideShowEntities();
        var list = ctx.Pictures.ToList();
        string bb = JsonConvert.SerializeObject(list);
        context.Response.Write(bb);

and js Code

<script type="text/javascript">
        $(function () {
            $.ajax({
                url: "Handler.ashx",
                contentType: "application/json; charset=utf-8",
                success: function (data) {
                    $.each(data, function (i, b) {
                        var str = '<img src="' + b.PicturePath + '" alt="' + b.PictureText + '"/>';
                        $("#featured").append(str);
                    });
                },
                dataType: "json"

            });

            $('#featured').orbit();
            alert($("#featured img").length);
        });
    </script>

but when run project no show any picture but when check code with firebug show this code

please help me. thanks all.

Answer 1

write this code

<script type="text/javascript">
        $(function () {
            $.ajax({
                url: "Handler.ashx",
                contentType: "application/json; charset=utf-8",
                success: function (data) {
                    $.each(data, function (i, b) {
                        var str = '<img src="' + b.PicturePath + '" alt="' + b.PictureText + '"/>';
                        $("#featured").append(str);
                    });

            $('#featured').orbit();
                },
                dataType: "json"

            });

            alert($("#featured img").length);
        });
    </script>