If click on a div, assign this url to the getJSON method.
<p>I have an app that display headline news using an API. However I would like to make it so that if the user clicks on a certain div area, the url used on the getJSON method changes, and so do the displayed news.</p>

<p>What I'm doing, is assigning a class to the div after the click:</p>

<pre><code>$(".block2").click(function(){
 $(this).addClass("selected");
  })
</code></pre>

<p>And then an if statement to check if the div has that class or not:</p>

<pre><code>if ($(".block2").hasClass("selected")){

   var url= "https://newsapi.org/v1/articles?source=buzzfeed&amp;sortBy=top&amp;apiKey=XXXX"

} else {

   var url= "https://newsapi.org/v1/articles?source=bbc-news&amp;sortBy=top&amp;apiKey=XXXX";

  }
</code></pre>

<p>Why does this work, when I go to the HTML and add manually the class "selected" to the .block2 div but it doesn't using the click function? According to the console the class gets added. I think I have to re-call the getJSON function after I add the class maybe? But I'm not sure how to do that.</p>