title: 2 TypeError: Cannot read properties of undefined (reading 'value') in reactjs with event handler
body: <p>What's the issue with my code ?</p>
  <p>I've gotten two - TypeError: Cannot read properties of undefined (reading 'value')</p>
  <p>expected behavior = click one button, the button uses class name red and calls function addValue if I click this button again it should call function removeValue and its color should change to white.</p>
  <p>Instead I get this type error and every button is highlighted in red.</p>
  <pre><code>const [color, setColor] = useState(false)
  
  
  
  function addValue(e) {
  &gt; 38 |     if (e.target.value !== &quot;&quot;) {
  
    function removeValue(e, value) {
  &gt; 63 |   if (e.target.value !== &quot;&quot;) {
  </code></pre>
  <p>These are the functions</p>
  <pre><code>function addValue(e) {
      if (e.target.value !== &quot;&quot;) {
        
        if (!favs.includes(e.target.value)) {
          favs.push(e.target.value);
          localStorage.setItem(&quot;name&quot;, JSON.stringify(favs));
          console.log(favs);
          document.getElementById(&quot;favsarray&quot;).innerHTML =  favs
        }
      }
    }
  
  
  
  function removeValue(e, value) {
      if (e.target.value !== &quot;&quot;) {
        //delete from array
        favs.pop(e.target.value);
        console.log(favs);
        //change the div text
        document.getElementById(&quot;favsarray&quot;).innerHTML = favs;
        //get the values from localstorage- parse
        const stored = JSON.parse(localStorage.getItem(&quot;name&quot;));
        //delete the value
        delete stored[(value, e.target.value)];
        //store the new array as a string
        localStorage.setItem(&quot;name&quot;, JSON.stringify(favs));
        console.log(stored);
      }
    }
  </code></pre>
  <p>I am calling this function with this and an event handler</p>
  <pre><code>function addOrRemove(e) {
    const elem = e.currentTarget;
    setColor(!color)
  if (color){
    addValue(elem)
  } else {
    removeValue(elem)
  }
  }
  
  
  &lt;button
                  id=&quot;btn&quot;
                  onClick={addOrRemove}
                  className={color? &quot;white&quot;: &quot;red&quot;}
                  value={&quot;Name:  &quot; + d.name + &quot;  Description:   &quot; + d.description + &quot;  Stars: &quot; + d.stargazers_count + &quot;  URL:   &quot; + d.html_url}
              
  </code></pre>