为什么搜索表单不工作

我使用一个实时搜索表单工作版本，但为什么我的电脑不能正常工作呢?我猜这是因为div class="wrapper faq"把事情搞砸了?

很抱歉，这是一个乱七八糟的html，但是复制1500行和4个css文档是没有用的。

提前感谢!

<script>
	'use strict';
	// search & highlight
	;( function( $, window, document, undefined )
	{
		var $container = $( '.faq' );
		if( !$container.length ) return true;
		var $input			= $container.find( 'input' ),
			$notfound		= $container.find( '.faq__notfound' ),
			$items			= $container.find( '> ul > li' ),
			$item			= $(),
			itemsIndexed	= [];
		$items.each( function()
		{
			itemsIndexed.push( $( this ).text().replace( /'s{2,}/g, ' ' ).toLowerCase() );
		});
		$input.on( 'keyup', function( e )
		{
			if( e.keyCode == 13 ) // enter
			{
				$input.trigger( 'blur' );
				return true;
			}
			$items.each( function()
			{
				$item = $( this );
				$item.html( $item.html().replace( /<span class="highlight">([^<]+)<'/span>/gi, '$1' ) );
			});
			var searchVal = $.trim( $input.val() ).toLowerCase();
			if( searchVal.length )
			{
				for( var i in itemsIndexed )
				{
					$item = $items.eq( i );
					if( itemsIndexed[ i ].indexOf( searchVal ) != -1 )
						$item.removeClass( 'is-hidden' ).html( $item.html().replace( new RegExp( searchVal+'(?!([^<]+)?>)', 'gi' ), '<span class="highlight">$&</span>' ) );
					else
						$item.addClass( 'is-hidden' );
				}
			}
			else $items.removeClass( 'is-hidden' );
			$notfound.toggleClass( 'is-visible', $items.not( '.is-hidden' ).length == 0 );
		});
	})( jQuery, window, document );
	// toggling items on title press
	;( function( $, window, document, undefined )
	{
		$( document ).on( 'click', '.faq h2 a', function( e )
		{
			e.preventDefault();
			$( this ).parents( 'li' ).toggleClass( 'is-active' );
		});
	})( jQuery, window, document );
	// auto-show item content when show results reduces to single
	;( function( $, window, document, undefined )
	{
		var $container = $( '.faq' );
		if( !$container.length ) return true;
		var $input		= $container.find( 'input' ),
			$items		= $container.find( '> ul > li' ),
			$item		= $();
		$input.on( 'keyup', function()
		{
			$item = $items.not( '.is-hidden' );
			if( $item.length == 1 )
				$item.addClass( 'js--autoshown is-active' );
			else
				$items.filter( '.js--autoshown' ).removeClass( 'js--autoshown is-active' );
		});
	})( jQuery, window, document );
</script>

 <!-- Search bar -->
        <div class="search-wrapper faq" >
            <div class="container container--add faq">
                    <input type="search" value="" placeholder="Search">
            </div>
        </div>
<!-- Movie preview item -->
        
            <div id="Page1" class="page" style="">
            <ul>
            	<li id="faq-1">
            	<h2><a href="#faq-1" class="movie__title link--huge">Last Vegas (2013)</a></h2>
                <div class="movie movie--preview movie--full release">
                     <div class="col-sm-3 col-md-2 col-lg-2">
                            <div class="movie__images">
                                <img alt='' src="images/movie/movie-sample1.jpg">
                            </div>
                    </div>
                    <div class="col-sm-9 col-md-10 col-lg-10 movie__about">
                            
                                                    
                                </div>
                    </div>
                    <div class="clearfix"></div>                                       
                </div>
                </li>
                <!-- end movie preview item -->
                <!-- Movie preview item -->
                <li id="faq-2">
            	<h2><a href="#faq-2" class="movie__title link--huge">the book thief (2013)</a></h2>
                <div class="movie movie--preview movie--full comments">
                     <div class="col-sm-3 col-md-2 col-lg-2">
                            <div class="movie__images">
                                <img alt='' src="images/movie/movie-sample2.jpg">
                            </div>
                    </div>
                    <div class="col-sm-9 col-md-10 col-lg-10 movie__about">
                           
                            
                                
                            </div>
                    </div>
                    <div class="clearfix"></div>
            </div>
                </div>
                </li>
            </ul>
                <!-- end movie preview item -->
</div>