When presenting partial views, how does jquery $ (document) .ready () react?

In $ (document) .ready (), I create a model popup for adding elements to the page, and it works great when the page loads for the first time, but it does not show a modal popup if it is called at least once, therefore, please tell me where am i doing something wrong that it does not show a modal view?

OR

Is jquery ready () called only once when the page loads?

here is jQuery:

$(document).ready(function () {

            //select all the a tag with name equal to modal
            $('a[name=modal]').click(function (e) {
                //Cancel the link behavior
                e.preventDefault();

                //Get the A tag
                var id = $(this).attr('href');

                //Get the screen height and width
                var maskHeight = $(document).height();
                var maskWidth = $(window).width();

                //Set heigth and width to mask to fill up the whole screen
                $('#mask').css({ 'width': maskWidth, 'height': maskHeight });

                //transition effect     
                $('#mask').fadeIn(1000);
                $('#mask').fadeTo("slow", 0.8);

                //Get the window height and width
                var winH = $(window).height();
                var winW = $(window).width();

                //Set the popup window to center
                $(id).css('top', winH / 2 - $(id).height() / 2);
                $(id).css('left', winW / 2 - $(id).width() / 2);

                //transition effect
                $(id).fadeIn(2000);

                // replacing text of divErrorMsg
                var htmlStr = $("#divErrorMsg").html();
                if (htmlStr != null && htmlStr.length > 0) {
                    htmlStr = null;
                    $("#divErrorMsg").text('');
                }
            });
       });

and here is the link where the popup is called:

<a name="modal" href="#iPopup" class="button smallButton">Add Item</a>

and iPopup:

<div id="Popups">
        <div id="iPopup" class="popup">
        <a class="closeButton">x</a>
        <div class="popupContent">
          <h3>Choose a question type</h3>
                  <ul class="chooseQuestion">
             <li>
            <div class="short">
            <label>Question 1</label>
              <input />
              <p class="description">Eg. This is a description.</p> 
              </div>
                          <%= Ajax.ActionLink("Text", "action", new { id = tId }, new AjaxOptions() { UpdateTargetId = "tItems" }, new { @class = "button" })%>
                     </li>
                     <li>
            <div class="short">
            <label>Question 2</label>
              <input />
              <p class="description">Eg. This is a description.</p> 
              </div>
                          <%= Ajax.ActionLink("Text", "action", new { id = tId }, new AjaxOptions() { UpdateTargetId = "tItems" }, new { @class = "button" })%>
                     </li>
                  </ul>
            </div>
    </div>
        <div id="mask"></div>
    </div>