jQuery .remove（）がJQueryを削除しようとしていません。

Question

"#buttonLicensedMovie"をクリックしたときに追加される$ movieDivを削除しようとしています。それはhtmlにちょうどいいが追加され、同じボタンがうまく隠れているはずです。私が抱えている問題はID「licensedMovie1」のアンカータグをクリックすると$ movieDivが削除されず、「＃buttonLicensedMovie1」が表示されないということです。何が間違っていますか？何か助けていただければ幸いです。ありがとう！

はJQuery：

$(function() { 
    $("#buttonLicensedMovie1").click(function(){ 
     var $movieDiv = '<p class="header">Becoming An Agent</p>\n<iframe width="500" height="281" src="https://www.youtube.com" frameborder="0" allowfullscreen></iframe>\r\n<br/><a id="licensedMovie1" class="video-close"><i class="fa fa-times" aria-hidden="true"></i> Close Video</a>'; 
     $("#movieLicensedWrapper1").append($movieDiv); 
     $("#buttonLicensedMovie1").hide(); 
    }); 
}); 
$(function() { 
    $("#licensedMovie1").click(function(){ 
     var $movieDiv = '<p class="header">Becoming An Agent</p>\n<iframe width="500" height="281" src="https://www.youtube.com/" frameborder="0" allowfullscreen></iframe>\r\n<br/><a id="licensedMovie1" class="video-close"><i class="fa fa-times" aria-hidden="true"></i> Close Video</a>'; 
     $("#movieLicensedWrapper1").remove($movieDiv); 
     $("#buttonLicensedMovie1").show(); 
    }); 
}); 

HTML：。

  <div class="col-xs-12"> 
      <button id="buttonLicensedMovie1" type="button" class="btn btn-default"><h5>Becoming an Agent <i class="fa fa-caret-square-o-right fa-lg" aria-hidden="true"></i></h5></button> 
      <div class="col-xs-12" id="movieLicensedWrapper1"> 
      </div> 
      </div> 

Answer 1

あなたはあなただけのhtmlを追加しているので、削除したいときしかし、あなたはDOM要素を選択する必要があり、それが正常に動作します追加してください。代わりに：

var $movieDiv = $('#movieLicensedWrapper1').find('.header'); 
$movieDiv.remove(); 

あなたが使用することができ

Answer 2

（ないすべてがpの内側にあるので、あなたのケースでは動作しません）：

$("#movieLicensedWrapper1 p.header").remove(); 

それとも、グローバル変数を作成して値を割り当てる：

$movieDiv = $.parseHTML('...'); 

それから、削除することができます：

$movieDiv.remove();