Celsius to fahrenheit toggles once and stops

1

Hi All

I have completed most of the coding for the weather page, but I have one slight problem. When you click on the temperature it toggles from Celsius to Fahrenheit but when you click it again it does not change back.

when I console.log the click function it executes on each click but I do not know why the units don’t change.

I have tried to read up on it but I cannot seem to find a solution to my problem.

Please assist, my codepen pagehoTHIS

2

you can try with .toggleClass() :

$(document).on("click", "#weathCon", function(){
    $("#weathCon").toggleClass("fahrenheit");
    
    if($("#weathCon").hasClass("fahrenheit")) {
      $("#weathCon").html(fahrenheit);
    } else {
      $("#weathCon").html(celsius);
    }
  });
3

Thank you so much Nkoyan, it works brilliantly.

I will immediately read up on toggleClass.

Thanks for the assistance

4

@duza-two - i use a fucntion on click of the hyper link which says “C” - Its really simple , the extra code is for adding text “C” and “F”, the real code is only 2 lines -

document.getElementById(“temperatureW”).innerHTML=Math.floor((temp*1.8)+32);

and

document.getElementById(“temperatureW”).innerHTML=Math.floor((document.getElementById(“temperatureW”).innerHTML-32)/1.8);

///////===================================Function below

function change(){
if(aTag.text===“C”){
aTag.innerHTML = “F”;
mydiv.appendChild(aTag);

     document.getElementById("temperatureW").innerHTML=Math.floor((temp*1.8)+32);
   //document.getElementById('temperatureC').innerHTML = 'F';
   console.log(document.getElementById("temperatureW").innerHTML);
   }
 
 else if (aTag.text==="F"){
     aTag.innerHTML = "C";
    mydiv.appendChild(aTag);
   document.getElementById("temperatureW").innerHTML=Math.floor((document.getElementById("temperatureW").innerHTML-32)/1.8);
   console.log(document.getElementById("temperatureW").innerHTML);
 }
     
   }
5

Hi jinisner

Thank you for that explanation. Your example is what I have seen others use but could not figure out how it was working.

I appreciate your input