実現したいこと
javasprictのクリックイベントinnnerHTMLにてdiv要素内を変更した後、更に変更された要素を使ってクリックイベントを使用したいが上手くイベントが発生できなくて困っています。
該当のソースコード(HTML)
<div class="change1"> 変更する要素 </div> <button class="button1">クリック</button>
該当のソースコード(js)
//クリックイベントinnerHTMLにてdiv内を変更 var button1 = document.querySelector('.button1'); button1.addEventListener('click',function(){ var change1 = document.querySelector('.change1'); change1.innerHTML ='<div class="change2">変更した要素</div><br><button class="button2">クリック</button>'; }); //変更されたdiv要素をクリックイベントinnerHTMLを使って更にdiv内を変更 var button2 = document.querySelector('.button2'); button2.addEventListener('click',function(){ var change2 = document.querySelector('.change2'); change2.innerHTML = '<div>更に変更</div>'; });
試したこと
divやbuttonタグを変更してみたり、jsファイルをイベントごとに分けたりしてみたが変更されませんでした。
補足情報(FW/ツールのバージョンなど)
FWなどは使用していません。
全てテキストエディタ(Atom)にべた書きしています。
一回目のクリックイベントinnerHTMLでは変更されます。
(<div class="change1">から<div class="change2">への変更は成功しています。)
回答2件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2019/09/02 15:40