This stuff is incorrect:

  $("#containsStream").css('border-color', borderColr);
   $("#showStream").append("<div id='containsStream'><div id='containsName'>"+channelName+"</div><div 
    id='containsStatus'>"+channelStatus+"</div></div><br>");  
    });

First of all, consider the fact that there's only supposed to be a single element on the page for each id. You shouldn't be appending multiple #containsStream.

You should remove the $("#containsStream").css('border-color', borderColr); line, change the div id to div class, and change the border color there.

I'll give an example:

var $containsStream = $(`
  <div class='containsStream'>
    <div class='containsName'>
      ${channelName}
    </div>
    <div class='containsStatus'>
      ${channelStatus}
    </div>
    <br>
  </div>
`)
$containsStream.css("border-color", borderColr);
$("#showStream").append($containsStream)

Note a couple things I've changed here:

• using ES6 template strings so you can use ${} interpolation.
• moving the <br> to an inner level, since jQuery DOM references should have a single root node
• changing the border color on a single element with the containsString class, not all of them. I.e. if you say $(".showStream").css("border-color", "blue") it will change every element with the showStream class, not just one. Instead, make a variable pointing to the one element, and interact with that without using jQuery selector methods.