menú responsive marcar activo

[fersosa]

Hola. sigo intentando con este menú.
Anda bien tal como dicen ustedes, pero al cambiar el # por el link en href no funciona y aparte no me despliega el menú.
dejo tal como lo tengo en este momento.
espero me puedan ayudar.
gracias

Código HTML:

<!-- SECCION MENU -->     
<div id="cuadromenu">
        <div id="fdw">
                <!--nav-->
                    <nav>
                        <ul>
                            <li class="current"><a href="#">Inicio</a></li>
                            <li><a href="#">Libros<span class="arrow"></span></a>
                                <ul style="display: none;" class="sub_menu">
                                    <li class="arrow_top"></li>
                                    <li><a href="infantil.html">Infantil</a></li>
                                    <li><a href="poesia.hrml">Poesía</a></li>
                                    <li><a href="narrativa.html">Narrativa</a></li>
                                </ul>
                            </li>
                            <li><a href="rese.html">Reseñas</a></li>
                            <li><a href="#">Contacto</a></li>
                            
                        </ul>
                    </nav>
        </div>
</div>
<!-- FIN SECCION MENU -->
 

Código CSS:

/* Slider
http://www.freshdesignweb.com/drop-down-responsive-menu-with-css3-and-jquery.html
*/
@import url(http://fonts.googleapis.com/css?family=Gentium+Basic:400,700|Yanone+Kaffeesatz);
/*===== nav style ======*/
#fdw nav select {
    display:none; /* this is just for the mobile display */
}
#fdw nav ul {
    display:block;
    z-index:999999;
}
#fdw nav ul li {
    display:inline-block;
    padding:50px 3px 30px;
    margin-left:30px;
    position:relative;
}
#fdw nav ul li a:link, #fdw nav ul li a:visited {
    color:#444;
    font:normal 20px 'Yanone Kaffeesatz', sans-serif;
    text-transform:uppercase;
    display:inline-block;
    position:relative;
}
#fdw nav ul li a:hover, #fdw nav ul li a:active {
    color:white;
    text-decoration:none;
}
#fdw nav ul li span {
    position:absolute;
    right:-12px;
    bottom:6px;
    width:7px;
    height:8px;
    margin:0 0 0 3px;
    float:right;
    display:block;
    background:url('images/nav_arrow.png') no-repeat left -8px;
    font:0/0 a;
}
#fdw nav ul li.current {
    border-bottom:2px solid white;
}
#fdw nav ul li.current a {
    color:white;
    cursor: default;
}
#fdw nav ul li.current a span {
    background:url('../images/nav_arrow.png') no-repeat left 0;
}
#fdw nav ul li.current ul li a {
    cursor:pointer;
}
 
/*===== sub_menu Style =======*/
#fdw nav ul li ul.sub_menu {
    position:absolute;
    top:90px;
    left:0;
    margin:0;
    padding:0;
    background:#fff;
    border:1px solid #ececec;
    border-top:5px solid #e25d29;
    display:none;
    z-index:999999;
    -moz-box-shadow: 0px 6px 7px #121012;
    -webkit-box-shadow: 0px 6px 7px #121012;
    box-shadow: 0px 6px 7px #121012;
}
#fdw nav ul li ul.sub_menu li.arrow_top {
    position:absolute;
    top:-12px;
    left:12px;
    width:13px;
    height:8px;
    display:block;
    border:none;
    background:url('images/arrow_top.png') no-repeat left top;
}
#fdw nav ul li ul.sub_menu li {
    float:none;
    margin:0;
    padding:0;
    border-bottom:1px solid #ececec;
}
#fdw nav ul li ul.sub_menu li a {
    white-space: nowrap;
    width: 150px;
    padding:12px;
    font:13px Arial, tahoma, sans-serif;
    text-transform:capitalize;
    color:#777;
}
#fdw nav ul li ul.sub_menu li a:hover {
    background:#f9f9f9;
    color:#333;
}
#fdw nav ul li ul.sub_menu li a.subCurrent {
    color:#e25d29;
    cursor:default;
}
#fdw nav ul li ul.sub_menu li a.subCurrent:hover {
    background:none;
}
/*===================== end Header style ======================*/
 
 
@media only screen and (min-width: 768px) and (max-width: 959px) {
        /* nav */
        #fdw nav ul li{
            margin-left:12px;
        }
}
 
    /* All Mobile Sizes (devices and browser) */
@media only screen and (max-width: 767px) {
 
        /* nav menu ul & select */
        #fdw nav ul {
            display:none;
        }
        #fdw nav select {
            width:100%;
            display:block;
            margin-bottom:30px;
            cursor:pointer;
            padding:6px;
            background:#f9f9f9;
            border:1px solid #e3e3e3;
            color:#777;
        }
}
 

Código Javascript:

<!--  javaScript -->
 
    <script> 
 
    <!--  // building select nav for mobile width only -->
    $(function(){
        // building select menu
        $('<select />').appendTo('nav');
     
 
        // building an option for select menu
        $('<option />', {
            'selected': 'selected',
            'value' : '',
            'text': 'Contenido...'
        }).appendTo('nav select');
     
 
        $('nav ul li a').each(function(){
            var target = $(this);
     
 
            $('<option />', {
                'value' : target.attr('href'),
                'text': target.text()
            }).appendTo('nav select');
 
 
 
        });
 
     
        // on clicking on link
        $('nav select').on('change',function(){
            window.location = $(this).find('option:selected').val();
        });
    });
    // show and hide sub menu
    $(function(){
        $('nav ul li').hover(
            function () {
                //show its submenu
                $('ul', this).slideDown(150);
            },
            function () {
                //hide its submenu
                $('ul', this).slideUp(150);        
            }
        );
    });
    //end
    </script>