0

hello all,
i want to create dynamacially this thing and want to populate data alternatively on green,red,gray li and so on but i can't able to do it plz help
i am weak in js :(

<li class="green">
                                <div class="metro_tmtime" datetime="2013-04-10 18:30">
                                <span class="date">1/4/13</span>
                                <span class="time">17:20</span> 
                                </div>
                                <div class="metro_tmicon">
                                    <i class="icon-bell"></i>
                                </div>
                                <div class="metro_tmlabel" id="data1">

                                </div>
                            </li>
                            <li class="purple">
                                <div class="metro_tmtime" datetime="2013-04-10 18:30">
                                <span class="date">1/4/13</span>
                                <span class="time">17:20</span> 
                                </div>
                                <div class="metro_tmicon">
                                    <i class="icon-bell"></i>
                                </div>
                                <div class="metro_tmlabel" id="data2">

                                </div>
                            </li>
                            <li class="yellow">
                                <div class="metro_tmtime" datetime="2013-04-10 18:30">
                                <span class="date">1/4/13</span>
                                <span class="time">17:20</span> 
                                </div>
                                <div class="metro_tmicon">
                                    <i class="icon-bell"></i>
                                </div>
                                <div class="metro_tmlabel" id="data3">

                                </div>
                            </li>
                            <li class="gray">
                                <div class="metro_tmtime" datetime="2013-04-10 18:30">
                                <span class="date">1/4/13</span>
                                <span class="time">17:20</span> 
                                </div>
                                <div class="metro_tmicon">
                                    <i class="icon-bell"></i>
                                </div>
                                <div class="metro_tmlabel" id="data4">

                                </div>
                            </li>
                            <li class="blue">
                                <div class="metro_tmtime" datetime="2013-04-10 18:30">
                                <span class="date">1/4/13</span>
                                <span class="time">17:20</span> 
                                </div>
                                <div class="metro_tmicon">
                                    <i class="icon-bell"></i>
                                </div>
                                <div class="metro_tmlabel" id="data5">

                                </div>
                            </li>
                            <li class="red">
                                <div class="metro_tmtime" datetime="2013-04-10 18:30">
                                <span class="date">1/4/13</span>
                                <span class="time">17:20</span> 
                                </div>
                                <div class="metro_tmicon">
                                    <i class="icon-bell"></i>
                                </div>
                                <div class="metro_tmlabel" id="data6">

                                </div>
                            </li>

my try so far

 //var colors = ["green", "purple", "yellow","gray","blue","red"];
                        //var arrayLength = colors.length;
            for(i in data) {

                        $( ".metro_tmlabael" ).empty();
                     htm += '<div class="metro_tmlabel" id="data"+j>'+'<h2>'+data[i].title + '</h2>'+'<br/>' + '<p>'+data[i].Activity+'</p>' +'</div>';
                      $('#data1').html(htm);
                      j++;
                      }

plz help

Edited by shany0786

3
Contributors
2
Replies
33
Views
9 Months
Discussion Span
Last Post by gentlemedia
1

Goggle
document.createElement

and

Element.appendChild

You can dynamically build pretty much whatever you want in script.

This question has already been answered. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.