前回の記事でハートが可愛く回ったかなと思います！！
今回の記事ではそのハートを１００個に増やしたいと思います！(うるさいだけやんw)
ではでは、勧めていきましょう😊

html側で百個も作るとめちゃくちゃ大変なので、JS側で作れるように実装していきましょう👍

CSSのみ残し、bodyタグに書いていきます。

index.html

<body>
  <script>
    'use strict';


    const div = document.createElement('div');
    div.classList.add('heart');

    div.addEventListener('click', () => {
      div .classList.toggle('circle');
    });

    document.body.appendChild(div);

  </script>
</body>

document.createElement('div')として、これを定数を指定して定義します。
ここから、処理を書いていきたいと思います。

div要素にheartというクラスを付けたいので、heartを追加します。

次にクリックしたときのイベントを追加したいので、EventListenerを追加し、ここでまたアロー関数を使用します👍

そして、bodyの子要素として処理するために、document.body.appendChild(div)を追加します。

わざわざ、HTMLで書かなくていいのはめちゃくちゃいいですね😊

ではこの子達を増やして行きたいと思います！！