Organize JavaScript for video player controls I have a small piece of code, and the problem is that I don't know how to organize it. There are tons of tutorials about JS code organization but I feel that those are for large scale apps. Also, I'm not sure if having the setInterval function where it is now is a big no no, can you come up with some critique/ideas?

YUI().use('node', function (Y) {
    // Access DOM nodes.

    var chapterTime = [0, 30, 49, 68, 90, 105, 127, 153, 182, 209],
        buttons = Y.one('ul'),
        currentChapter = 0,
        prevChapter = 0,
        myPlayer = videojs('example_video_1');

    buttons.delegate('click', function () {
        var button_name =  this.ancestor().get('id'),
            chapter = button_name.slice(1);

            playChapter(chapterTime[chapter-1], this);
    }, 'a');    

    function playChapter(chTime, chButton) {        
        myPlayer.play();
        setTimeout(function(){ myPlayer.currentTime(chTime); },100);
        Y.all('#nav a').setStyle('backgroundColor', "#999");
        chButton.setStyle('backgroundColor', '#666');
    }


    setInterval(function(){
        var playbackTime = myPlayer.currentTime(),
            i = 0,
            chapterFound = false;
            //console.log(chapterTime);


        while (i &lt;= 9 &amp;&amp; chapterFound == false){
            if (playbackTime &gt;= chapterTime[i] &amp;&amp; playbackTime &lt; chapterTime[i+1]){
                currentChapter = i + 1;
                chapterFound = true;
            } else {
                i++;
            }
        } 

        if (currentChapter != prevChapter){
            var button = Y.one('#c' + currentChapter);
            Y.all('#nav a').setStyle('backgroundColor', '#999');
            button.one('a').setStyle('backgroundColor', '#666');
            prevChapter = currentChapter;
        }
    },1000);
});
This looks just fine to me.

Some very minor nitpicks:


Remove //console.log(chapterTime);
Consider removing the blank line after var statements, it does not add much
chapterTime could use a comment as to what those numbers express (I assume seconds)
I would probably write this

buttons.delegate('click', function () {
    var button_name =  this.ancestor().get('id'),
        chapter = button_name.slice(1);

        playChapter(chapterTime[chapter-1], this);
}, 'a');   


as

buttons.delegate('click', function () {
        var chapter = this.ancestor().get('id').slice(1) - 1;
        playChapter(chapterTime[chapter], this);
}, 'a');   

The color strings #999 and #666 have a meaning, I assume enabled/disabled, you could use properly named constants for these, declared on top
Only seldom use double newlines, they are vertical overkill


Still, all in all I like your code.