title: Change the color of a button using Jquery Ajax (Color received from external PHP file)
body: <p>This is my HTML code</p>
  
  <pre><code>&lt;form class="addtowatchlistform" action="logo/insertwatchlist.php" method="POST"&gt;
  
      &lt;input type="hidden" name="tmdb_id" value="'.$result[$x]["tmdb_id"].'"/&gt;
      &lt;button id="addtowatchlistbutton" type="submit" name="tmdb_id" value="'.$result[$x]["tmdb_id"].'" data-tooltip="'.$addremove.' TO YOUR WATCHLIST" class="material-icons" style="color:'.$watchlisticoncolor.'"&gt;add_box&lt;/button&gt;
  
  &lt;/form&gt;
  
     // Same form as above
  &lt;form class="addtowatchlistform" action="logo/insertwatchlist.php" method="POST"&gt;
  
      &lt;input type="hidden" name="tmdb_id" value="'.$result[$x]["tmdb_id"].'"/&gt;
      &lt;button id="addtowatchlistbutton" type="submit" name="tmdb_id" value="'.$result[$x]["tmdb_id"].'" data-tooltip="'.$addremove.' TO YOUR WATCHLIST" class="material-icons" style="color:'.$watchlisticoncolor.'"&gt;add_box&lt;/button&gt;
  
  &lt;/form&gt;
  </code></pre>
  
  <p>Jquery Code:</p>
  
  <pre><code>&lt;script&gt;
  $(".addtowatchlistform").submit(function(e) {
    var data = $(this).serialize();
    var url = $(this).attr("action");
    $.post(url, data, function() {
      try {
          data = JSON.parse(data);
          $("button#addtowatchlistbutton").css('color',data.watchlisticoncolor);
      } catch (e) {
          console.log("json encoding failed");
          return false;
      }
  });
    return false;
  });
  &lt;/script&gt;
  </code></pre>
  
  <p>PHP file <code>insertwatchlist.php</code> file</p>
  
  <pre><code>$response = new \stdClass();
  $response-&gt;watchlisticoncolor = "red";
  die(json_encode($response));
  </code></pre>
  
  <p>Output of PHP file <code>insertwatchlist.php</code> file </p>
  
  <pre><code>{"watchlisticoncolor":"red"}
  </code></pre>
  
  <p><strong>Expected Result:</strong></p>
  
  <p>1.)When someone clicks on <code>add_box</code> button, it submits the form without reloading the page (This one works fine)</p>
  
  <p>2.) <code>insertwatchlist.php</code> sends this code: <code>{"watchlisticoncolor":"red"}</code> and, the Jquery code place them in place of: <code>$watchlisticoncolor</code> variable, in the real time without reloading the page. (This one do not work),</p>
  
  <p>Console tab do not show anything. Here is the screenshot of network tab, when someone clicks on the button <a href="http://prntscr.com/fxwt16" rel="nofollow noreferrer">http://prntscr.com/fxwt16</a></p>