Swapping Text on Click

Heyo!

I’m trying to switch between weather description, cloud coverage percent, wind speed/direction, and humidity on the click of a button w/ id=description for my local weather app.

Right now, I’m testing this function with the text “A”,“B”,“C”, and “D” and there’s a bug:

When I hit my “#getWeather” button, everything works fine: I can hit the “#description” button and it displays
A,B,C,D in order. But after I hit the “#getWeather” button again, the “#description” button gets pretty wonky

To switch between the html, I made this function:

$("#description").click(function(){
  if(changeDescription===1){
    $("#description").html("B");
  changeDescription++;
                            }
 else if(changeDescription===2){
      $("#description").html("C");
      changeDescription++;
                          }
else if(changeDescription===3){
    $("#description").html("D");
    changeDescription++;
  }
 else{
    $("#description").html("A");
      changeDescription=1;
                        };
});

I also set var changeDescription=1 globally and reset the changeDescription=1 if the #getWeather button is clicked.

Here is the codepen: https://codepen.io/rhuss623/pen/yELzBK

Any help is appreciated!!!

I’ve edited your post for readability. When you enter a code block into the forum, precede it with a line of three backticks and follow it with a line of three backticks to make easier to read. See this post to find the backtick on your keyboard. The “preformatted text” tool in the editor (</>) will also add backticks around text.

markdown_Forums

1 Like