JQuery - Multiple Functions on One Element

Im currently developing a site for Wordpress for a client, and they want to have a scroller that disappears from the click of a button and then displays the content in a modal window blah blah blah ... It seems that everything works, except when I collect everything this together, when I click on the li element, it just displays the link in the address bar and does not go anywhere ... I have a feeling that this is due to disabling the normal href function, but I was not sure how to get around it.

So, for the scroller, I have the following structure

<div class="scrollerone">
    <ul>
        <li><a href=""><img src="image.jpg" /></a></li>
        <li><a href=""><img src="image.jpg" /></a></li>
        <li><a href=""><img src="image.jpg" /></a></li>
        <li><a href=""><img src="image.jpg" /></a></li>
        <li><a href=""><img src="image.jpg" /></a></li>
        <li><a href=""><img src="image.jpg" /></a></li>
        <li><a href=""><img src="image.jpg" /></a></li>
    </ul>
</div>

I have jQuery code as follows.

<script type="text/javascript">
    jQuery(function() {
        jQuery(".scrollerone").jCarouselLite({
            btnNext: "#btnnext1",
            btnPrev: "#btnprev1"
        });
    });
</script>

<script type="text/javascript">
    jQuery(function(){
        var list = jQuery('.scrollerone');
        var original_height = list.height();
        var new_height = '0';
        list.css({height:new_height});

        jQuery('#refl').click(function() {

            if(list.height() == original_height){
                jQuery('.viewcs').html('VIEW ALL CASE STUDIES');                                    
                list.animate({height:new_height});
            } else {
                list.animate({height:original_height});
                jQuery('.viewcs').html('CLOSE ALL CASE STUDIES');
            }
            return false;
        });
    });
</script>

- , ... , return false , li , ?

,