How to get 2 div values in the pop up for updating the card.

I am creating a Kanbanize app and have cards on my webpage which displays the title and description.Clicking on the card, I want to display both title and description and the Planned start and finish date as selected by the user during card creation.

Here is my html:

    <a href="#" data-toggle="modal" data-target="#newModal" data-whatever="EditCard" style="color:darkred;">
        <div data-id="<%= tablelist[i].NC_TITLE %>" class="open-AddCardTitle" style="text-align: center; background-color: burlywood;"  name="title" ><%= tablelist[i].NC_TITLE %></div>
        <div data-id="<%= tablelist[i].NC_DESC %>" class="open-AddCardDesc" style="text-align: center; height: 50px;" name="desc"><%= tablelist[i].NC_DESC %></div>
    </a>
     <!-- Modal- Edit Card -->
     <div class="modal fade" id="newModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
      <div class="modal-dialog">
      <div class="modal-content">
      <div class="modal-header">
       <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
      <h4 class="modal-title">Update Card</h4>
      </div>
      <form action="editcard" method="post" id="editcard" class="form-horizontal" role="form">
        <div class="modal-body" style="height: 230px;">
         <div class="form-group">
            <label for="title" class="col-md-3 control-label">Title</label>
             <div class="col-md-9">
               <input type="text" class="form-control" id="title" name="title" value=""/>
              </div>
              </div>
            <div class="form-group">
            <label for="title" class="col-md-3 control-label">Description</label>
            <div class="col-md-9">
               <textarea class="form-control" id="desc" name="desc" value=""></textarea>
            </div>
           </div>

          <div class="form-group">
            <label for="priority" class="col-md-3 control-label">Date Range</label>
            <div class="col-md-4">
                 <input type="text" id="datepicker2" name="startdate" Placeholder="Planned Start Date...">
            </div>
            <div class="col-md-4">
                 <input type="text" id="datepicker3" name="finishdate" Placeholder="Planned Finish Date...">
            </div>
            </div>
           </div>
          <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
             <button type="submit" class="btn btn-primary">Update Card</button>
           </div>
          </form>
         </div><!-- /.modal-content -->
        </div><!-- /.modal-dialog -->
       </div><!-- /.modal -->

Javascript:

 <script>
   $(document).on("click", ".open-AddCardTitle", function () {
    var title = $(this).data('id');
    $(".modal-body #title").val( title );
    });

    $(document).on("click", ".open-AddCardDesc", function () { 
     var desc = $(this).data('id');
     $(".modal-body #desc").val( desc );
    });
    </script> 

Please let me know how I can get both title and desc on the same click, instead of clicking on both div's separately. Thanks.