title: Create a clickable circle 10 times using javascript and if I click on it, it shows number in center how many time I clicked
body: <p>I am practicing javascript. I want to have 10 circles with different colors. I can create 10 circles using html and css, but need help with javascript. For each circle show the number of times it is clicked on. If I click on blue 3 times, it should show 3 in the center of circle</p>
  <pre><code>    &lt;style&gt;
          .circle{
              border-radius: 50%;
              width: 40px;
              height: 40px;
              padding: 3px;
              background: blue;
              border: 2px solid black;
              text-align: center;
          }
      &lt;/style&gt;
      
  &lt;/head&gt;
  &lt;body&gt; 
      &lt;div class=&quot;circle&quot;&gt;
          3
      &lt;/div&gt;
  &lt;/body&gt;
  </code></pre>