How to scroll LI items in a fixed height UL?

Question

Here is my example HTML.

And I want to have scroll for my LI items.

Which are of 2 levels. Means, I want to apply class on every UL.

So how can I do that. By using JQuery or CSS tweaking.

PS: I am using this example.

<ul id="nav" class="dropdown">
<li class="dir">
    Item_Root
    <ul>
        <li class="dir">
            Item_1_Level
            <ul>
                <li>Item_Level_2</li>
                <li>Item_Level_2</li>
                <li>Item_Level_2</li>
                <li>.... up to N items</li>
            </ul>
        </li>
        <li>Item_Level_1</li>
        <li>Item_Level_1</li>
        <li>Item_Level_1</li>
        <li>Item_Level_1</li>
        <li>.... up to N items</li>
    </ul>
</li>

 </ul>  

Answer 1

With your posted mark-up, and the best guess I could make of the intent of your question (your title doesn't really match the example you linked to), I came up with this:

#nav {
    width: 12em;
    height: 20em;
    line-height: 2em;
    border: 1px solid #ccc;
    padding: 0;
    margin: 0;
    overflow: scroll;
    overflow-x: hidden;
}

li {
    border-top: 1px solid #ccc;
}

ul ul {
    text-indent: 1em;
}

ul ul ul {
    text-indent: 2em;
}

JS Fiddle Demo.