<div class="list-group">
<div id="id1" class="list-group-item" data-target="@Url.Action("Index","DayilyProposials")" >
<span class="badge" style="font-size:10px;color:#fff" id="DailyPropNumber">0</span>
<span style="font-size:10px;font-weight: 900;font-weight: 900;">Daily Proposals</span>
</div>
<div id="id1" class="list-group-item" data-target="@Url.Action("HotG","home")">
<span class="badge" style="font-size:10px;color:#fff" id="HotGamesNumber">0</span>
<span style="font-size:10px;font-weight: 900;">@index.Index.hotgames</span>
</div>
<div id="id1" class="list-group-item" data-target="@Url.Action("Index","home")">
<span class="badge"style="font-size:10px;color:#fff" id="TodayNumber">0</span>
<span style="font-size:10px;font-weight: 900;">Today</span>
</div>
<div id="id1" class="list-group-item" data-target="@Url.Action("Index","home")">
<span class="badge" style="font-size:10px;color:#fff" id="ByTimeNumber">0</span>
<span style="font-size:10px;font-weight: 900;">@index.Index.bytime</span>
</div>
<div id="id1" class="list-group-item" data-target="@Url.Action("Live", "home")">
<span class="badge" style="font-size:10px;color:#fff" id="LiveMatchesNumber">0</span>
<span style="font-size:10px;font-weight: 900;">@index.Index.livematches</span>
</div>
</div>
this is my script
$(function(){
$.ajaxSetup ({
cache: false
});
var ajax_load = "<img src='http://automobiles.honda.com/images/current-offers/small-loading.gif' alt='loading...' />";
var loadUrl = $(this).attr("data-target");
$("#id1").click(function(){
$("#mainInfo").html(ajax_load).load(loadUrl);
});
});