JSFiddle - React, Tailwind, and code Playground

HTML

<div id="container">
    <div id="header">
         <h1>Main Title of Web Page</h1>
Here I am trying to split the webpage into two columns and display text.</div>
    <div id="one"></div>
    <div id="two"> <b>This is test one<br /></b>
 <b>This is test two<br /></b>

    </div>
</div>

CSS

#container {
    width:100%;
    height:200px;
}
#header {
    margin-bottom:0;
    background-color:red;
}
#one {
    width:40%;
    height:200px;
    float:left;
    background-color:yellow;
}
#two {
    width:60%;
    height:200px;
    float:left;
    background-color:cyan;
}
#one > span {
    display:block;
}

JavaScript

desc[0] =  "manhole cover on foothpath on barrog gaa grounds kilbarrack road loose."
desc[1] =  "Footpath at driveway to 17 Maywood Lawn in bad state of disrepair."
 
 window.onload = 

function incidentList(){
  var full_list = ""
  for(var i=0; i<desc.length; ++i){
      full_list = full_list + desc[i] + '<br>'
  }
  $("#two").text(full_list);     
}