title: Update the dropdown list on AJAX success function
body: <p>I have a Dropdown list where I choose the League and another dropdown which features the teams according to the league selected in the first dropdown. My problem is what to include in the success function of the AJAX Call to update the dropdown list with the selected league. Could anyone help me achieve this. Thanks</p>
  <p><strong>PHP DB Query / view_fixtures_queries.php</strong></p>
  <pre><code>$league = '';
  
  if(isset($_POST['selected'])):
     $league = $_POST['selected'];
  endif;
  
  $home_team = $dbh-&gt;prepare(&quot;SELECT * FROM teams WHERE competition = :league&quot;);
  
  echo &quot;&lt;script&gt;console.log($league)&lt;/script&gt;&quot;;
  
  $home_team-&gt;execute([ ':league' =&gt; $league ]);
  
  $data  = $home_team-&gt;fetchAll();
  
  print_r($data);
  </code></pre>
  <p><strong>Fetching Teams in Teams Dropdown List</strong></p>
  <pre><code>&lt;?php
     while ($row = $home_team-&gt;fetchAll()) 
     {
         $hometeamlogo = $row['logo'];
         $hometeamstadium = $row['stadium'];
         echo &quot;&lt;option value='data:image/png;base64,&quot;.base64_encode( $hometeamlogo ).&quot;' data-stadium='$hometeamstadium'&gt;&quot; . $row['team_name'] . &quot;&lt;/option&gt;&quot;;
     }
  ?&gt;
  </code></pre>
  <p><strong>AJAX Call to send the selected league</strong></p>
  <pre><code>//input_competition is the league dropdown
  $('#input_competition').on('change', function () {
           var selectedLeague = $('#input_competition').find(&quot;:selected&quot;).text();
             
           $.ajax({
              url: 'queries/view_fixtures_queries.php',
              type: 'POST',
              data: {'selected' : selectedLeague},
              success: function(data) {
                  //what to include here
                  console.log(data);
              }
       });
  });
  </code></pre>