SystemMonitoring Javascript SelectNextDiv

dashboard.spark

<use namespace="System.Linq" />
<viewdata model="SystemMonitoring.Features.DashboardViewModel" />
<content:main>
	<div class="container-fluid">
		<div class="sidebar">
			<div class="row" each="var c in Model.Clients">
				<br />
				<div class="client btn large primary" data-client-id="${this.Urls.UrlFor(new SystemMonitoring.Features.ClientDetails.ClientDetailsRequestModel { Id = c.Id })}">${c.Name}</div>
			</div>
		</div>
		<div id="client-details" class="content" />
	</div>
</content:main>

master.js

$(document).ready(function () {
    selectNext();

    var selectNext = function () {
        //Select the 'active' div
        var target = $('div.client.active');
        //If there is no 'active' div
        if (target.size() == 0) {
            //Select the first 'client' div and make it 'active'
            target = $('div.client').first();
            target.addClass('active');
        }
        else {//If there is an 'active' div, make it inactive
            target.removeClass('active');
            //Select the next 'client' div and make it 'active'
            target = target.next();
            target.addClass('active');
        }
        //Click the new 'active' div
        target.click();

        updateInterval();
    };

    var updateInterval = function () {
        setTimeout(selectNext, 3000);
    };

    //Takes all elements with a class 'client', 
    //and forwards it's alerts to an element (div) with an id 'client-details'
    //using an ajax request
    $('.client').click(function () {
        var url = ($(this).data('client-id'));
        $.ajax({
            url: url,
            type: 'GET',
            dataType: 'html',
            success: function (response) {
                $('#client-details').html(response);
            }
        });
    });

});