Thursday, 22 August 2013

How to append data only once using jquery

How to append data only once using jquery

Below is the my code for clicking functionality of tabs.
<body>
<div class="row-fluid">
<div class="span1 offset1">
<div class="tabbable" align="center">
<ul class="nav nav-tabs nav-stacked">
<li class="active"><a href="#tabs-1"
data-toggle="tab">Eat</a>
</li>
<li><a href="#tabs-2">Drink</a>
</li>
</ul>
</div>
</div>
<div id="1"></div>
</div>
<script type="text/javascript">
$("a[href=#tabs-1]").click(function() {
for (i = 0; i < mytabs.length; i++) {
$('div').append("<br>" + mytabs[i] + "<br>");
}
});
</script>
</body>
And here I am using javascript to store the values of tabs in array
<script>
$(function() {
$("#tabbable").tabs();
});
var i;
var mytabs = new Array();
mytabs[0] = "Saab";
mytabs[1] = "Volvo";
mytabs[2] = "BMW";
</script>
Now I want that after clicking on tabs the values stored in data should
get displayed. But what my code is doing , It is showing the data as many
times as the data is stored in array. Means I want output as
Saab,Volvo,BMW but is displaying it three times. Can anyone help me in
this that what to use instead of append so that i get the desired output.

No comments:

Post a Comment