Flexslider - show tooltip while mouse hover on dots

Question

I am using http://flexslider.woothemes.com/ flex slider plugin in my page.

Below is my code for flexslider:

html: 
<div class="flexslider">
    <ul class="slides">
        <li>Image 1</li>
        <li>Image 2</li>
        <li>Image 3</li>
    </ul>
</div>

js: java script code for flex slider and this code is used to initialize the flex slider while page load.

    $(window).load(function() {
            $('.flexslider').flexslider({   
                animation: "slide",
                slideshow: false,
                controlNav: true,
                directionNav: false,
                easing: "swing"
            });
        });

All, I want is when I mousehover to dots (which used for navigation among slides) a tooltip should reneder and show some kind of message say "Slide number".

Answer 1

As suggested by RRR, I have added title to each of the dots.

$(".flexslider ol li a").each(function(index){
   $(this).attr("title","slide number "+(index+1));
});

Please refer this fiddle