동적으로 생성 된 링크를 클릭하여 해당 링크에서 새 동적 페이지를 생성하는 방법은 무엇입니까?

medium.com에서 블로그에 대한 정보를 가져 오는 사용자 정의 API (node.js 앱)를 작성했습니다.

1. 기사의 저자 / 주요 사진,
2. 표제,
3. medium.com의 기사 링크 (중복),
4. JSON 출력의 전체 기사 텍스트.

샘플 API / JSON :

{
"img": [
"https://upload.wikimedia.org/wikipedia/commons/4/42/Blog_%281%29.jpg"
],
"title": [
"The old and the new or not so new: Java vs JavaScript"
],
"link": [
"https://medium.com/@aki9154/the-old-and-the-new-or-not-so-new-java-vs-javascript-760f84e87610?source=rss-887f1b1ddb75------2"
],
"desc": [
"<p>It’s funny how the name JavaScript makes you believe that it is somehow..."
]
}

그런 다음이 API / JSON을 폴링하고 출력을 썸네일 형식, 현재 기본 html (디자인 / CSS 없음)으로 뱉어냅니다.

사용자가 썸네일을 클릭하고 올바른 기사를 표시해야하나요?!

썸네일 / 기사를 클릭 할 때 새 페이지를 표시해야하는 경우 동적으로 생성 된 새 페이지의 출력으로 위의 JSON에서 # 4를 사용하여 멋지게 표시 할 수 있습니다.)

지금 직면하고있는 문제는 동적으로 생성 된 링크를 클릭 할 때 올바른 기사를 동적으로 생성하는 방법입니다.

지금은 썸네일을 클릭해도 아무 일도 일어나지 않으며이 프로젝트 링크가 표시됩니다.

나는 스택 오버플로 연구를하고 일부 jQuery 문서 (이벤트 전파 등 ...)를 읽고 index.js를 변경할 수있었습니다. 아래는 어떻게 생겼지 만 아무것도 작동하지 않습니다. 어떤 도움을 주시면 감사하겠습니다 ...

index.js :

$(function () {
  var desc = "";
  function newWin() {
    var w = window.open();
     $(w.document.body).html('<p>'+desc+'</p>');
   }
    var $content = $('.cards-in-grid');
    var url = 'link-for private use now';
    $.get(url, function (response) {
      var output = '';
      console.log(response);
      $.each(response, function (k, item) {
      title = item.title;
      var author = item.img;
      desc = item.desc;
      output += '<li><img src="'+author+'" alt=""><h2>' + title + '</h2></li>';
      $(".cards-in-grid ul").on("click", "li", function(){
        newWin;
      });
      return k;
    });
    $content.html(output);
   });
 });