Weather App - Celcius Fahrenheit Toggle probs

Weather App - Celcius Fahrenheit Toggle probs


Hi All,

I’m scratching my head at this one. Basically the document loads with empty fields for Temperature and Degrees symbol, which I update with jQuery after user clicks “Get Weather Data”. The problem comes when I try to reference the html of the Temperature field. I had changed the html with jQuery to reflect the JSON data from API, but when I try to check the value of #temp in the console, it returns “function()” (not a number as I would expect). Please take a look and let me know what you think!

Here is the code for updating temp field when Degrees field is clicked:

  var degreesC = temp;  //temp is storing data from JSON
  var degreesF = ((temp * 9/5) + 32);
  var degrees = $("#degrees").html;
    if (degrees == "&deg <a>C</a>"){ //#temp is in Celsius
      $("#degrees").html("&deg <a>F</a>");
    else if (degrees == "&deg <a>F</a>"){//should mean that #temp is in Fahrenheit
      $("#degrees").html("&deg <a>C</a>");  

I had originally tried checking what the value of #temp was and comparing that to variable temp, but ran into the same problem. Here is link to the full CodePen:

Thanks so much!


Change the following line:

var degrees = $("#degrees").html;


var degrees = $("#degrees").text();

and then change the following if statement line

  if (degrees == "&deg <a>C</a>"){


  if (degrees ==  "° C"){

and then the following else if line

  else if (degrees == "&deg <a>F</a>"){

to just an else

  else{ // because you know it was not Celsius



I see now that when I had tried running with .text() I had left off the parentheses. Thanks again for your help today and the other day.

Would appreciate it if you could off just some general feedback on the appearance/layout of my weather app (


Just as an info: I’m guessing you tried to match the weather image’s background color but you are just a tiny bit off. If that’s the case the right one would be: #272a33.


Also, on a smaller width screen, I see:

The degree unit is on a separate line and the icon is shifted to the right.


Thank you both. I changed the background color and will do some digging to keep degrees on same line and keep icon centered