title: document.querySelecterAll is not working in react
body: <p>I am building a simple react app. I am trying to render a <code>JSX</code> element with some labels in it. And I am trying to run <code>javascript</code> code on click on particular <code>querySelectorAll</code> <strong>&quot;label&quot;</strong> but it is not working when I click on any label present in page. I am new in React.</p>
  <p>App.js</p>
  <pre><code>class App extends React.Component {
      render() {
  
          const options = document.querySelectorAll(&quot;label&quot;);
  
          for (let i = 0; i &lt; options.length; i++) {
            options[i].addEventListener(&quot;click&quot;, ()=&gt;{
              console.log(i)
           });
          }
  
          return (
          &lt;div&gt;
              &lt;label htmlFor=&quot;1&quot; className=&quot;div-down&quot;&gt;
                  &lt;span&gt;HTML&lt;/span&gt;
              &lt;/label&gt;
  
              &lt;label htmlFor=&quot;2&quot; className=&quot;div-down&quot;&gt;
                  &lt;span&gt;JavaScript&lt;/span&gt;
              &lt;/label&gt;
          &lt;/div&gt;
          )
      }
  }
  
  
  export default App;
  </code></pre>
  <p>When I run the above code then it is showing nothing.</p>
  <p>I have also tried putting <code>javascript</code> code in <code>.js</code> file and importing it but it is still not working. I have also tried by putting <code>javascript</code> code in <code>index.html</code> file but still not worked</p>
  <p>Any help would be much Appreciated. Thank You Very much</p>