<div id="reserveButtonOuter">  <button id="reserveButton">Reserve a Table</button> </div>

                                <div id="sb-search" class="sb-search">
                      <form>
                        <input class="sb-search-input" placeholder="Enter your search term..." type="search" value="" name="search" id="search">
                        <input class="sb-search-submit" type="submit" value="">
                        <span class="sb-icon-search"></span>
                      </form>
            </div>

;( function( window ) {

    function UISearch( el, options ) {
      this.el = el;
      this.inputEl = el.querySelector( 'form > input.sb-search-input' );
      this._initEvents();
    }

    UISearch.prototype = {
      _initEvents : function() {
        var self = this,
          initSearchFn = function( ev ) {
            if( !classie.has( self.el, 'sb-search-open' ) ) { // open it
              ev.preventDefault();
              self.open();
            }
            else if( classie.has( self.el, 'sb-search-open' ) && /^s*$/.test( self.inputEl.value ) ) { // close it
              self.close();
            }
          }

        this.el.addEventListener( 'click', initSearchFn );
        this.inputEl.addEventListener( 'click', function( ev ) { ev.stopPropagation(); });
      },
      open : function() {
        classie.add( this.el, 'sb-search-open' );
      },
      close : function() {
        classie.remove( this.el, 'sb-search-open' );
      }
    }