单击时不显示CSS / Javascript模式对话框

Question

我按照this简单教程构建模态对话框

的index.html：

   <div id="results">
    <div id="resultsListing">
      <ol class="results">
        <li class="place clearfix">
          <div class="dish-result">
            <div class="header clearfix">
              <a href="javascript:void(0)" class="dish-name"></a><a href=
              "javascript:void(0)" class="place-name"></a>
            </div>
          </div>
        </li>
      </ol>
    </div>
  </div>

（等...）

 <div id="overlay">
    <div id="dish-popup-container">
      <div id="dish-popup" class="popup">
        <div class="dish clearfix">
          <div class="header"></div>

          <div class="details">
            <div class="like-button">
              <a href="#" class="button">/* this should replaced with dynamic content
              */</a><span class="counter-b">0</span>
            </div>
          </div><a href="#" class="closeDOMWindow">x</a>
        </div>
      </div>
    </div>
  </div>

searchui.js：

function onPlaceClicked(place_id, dish_id, serp) {
    var place = placesById[place_id];
    var dish = getDishById(place, dish_id);
    var dict = {
        place:place,
        dish:dish,
        topDish:dish,
        serp:serp
    };
    changeState({place:place_id, dish:dish_id});

    $(document).trigger('placeClicked', [dict]);
}

function popupPlace(dict) {
    $('div#dish-popup').render(dict,window.dishPopupTemplate);
    if(typeof(dict.dish) === 'undefined') {
        $('div#dish-popup').addClass('place-only');
    } else {
        $('div#dish-popup').removeClass('place-only');
    }

    $('#overlay').show();

    showPopupMap(dict.place, "dish-popup-map");
}

我不确定这部分是否必要，但仍然包括在内：

custom.js：

/* Modal Dialog */
function overlay() {
    el = document.getElementById("overlay");
    el.style.visibility = (el.style.visibility == "visible") ? "hidden" : "visible";
}

CSS：

/* =Overlay
-------------------------------------------------------------- */
#overlay {
     visibility: hidden;
     position: absolute;
     left: 0px;
     top: 0px;
     width:100%;
     height:100%;
     text-align:center;
     z-index: 1000;
}

#overlay #dish-popup {
     width:300px;
     margin: 100px auto;
     background-color: #fff;
     border:1px solid #000;
     padding:15px;
     text-align:center;
}

现在，当我点击.place列表项时。 #overlay div没有出现。

这可能是什么原因？