Purpose for JS

Summary

While working on creating events, on EventCombo, and customizing each webpage, I saw a need to elevate the look and feel. I found a way to use my own style sheets and Javascript, by manipulating EventCombos DOM, overriding their default styles and adding animation to give a smooth user experience(UX) and creative and interesting user interface(UI). I used the JS script below to add functionality to the sites, along with the unique customization. See my CodePen.io to view animation

STEM softskills: creativity , critical thinking, vision

                                
                                    function readMore()
                                        {  //get elements assign to variable
                                            var dotText = document.getElementById("dot");
                                            var readMoreText = document.getElementById("readMore");
                                            var btnText = document.getElementById("btn");

                                          if(readMoreText.style.display == "none")
                                          {
                                            dotText.style.display = "none";
                                            readMoreText.style.display = "inline";
                                            btnText.innerHTML = "read less";
                                          }
                                          else
                                          {
                                            dotText.style.display = "inline";
                                            readMoreText.style.display = "none";
                                            btnText.innerHTML = "read more";
                                          }
                                        }
                                       document.body.onload = addElement;
                                      function addElement () {
                                      // CREATE A NEW DIV ELEMENT 
                                      const newDiv = document.createElement("div");
                                      newDiv.setAttribute("id", "myID");
                                      newDiv.setAttribute("class", "bg-info mx-auto text-center");
                                      //CREATE NEW IMG ELEMENT TO APPEND TO NEW DIV
                                      newContent = document.createElement("img");
                                      newContent.src = "https://www.eventcombo.com/Images/
                                      ECImages/46a7b124-87a6-4aaf-ae36-95572a94bbf7.jpg";

                                      //CREATE NEW DIV2 ELEMENT
                                      const newDiv2 = document.createElement("div");
                                      newDiv2.setAttribute("id", "myID2");
                                      newDiv2.setAttribute("class", "bg-success text-black text-uppercase
                                      font-weight-bold mx-auto text-center");
                                      
                                      // CREATE NEW P ELEMENT TO APPEND TO NEW DIV2
                                      newContent2 = document.createElement("p");
                                      var t = document.createTextNode("Added New Dynamic 'div', 'paragraph',
                                      'text' and 'image' created with Javascript; ");
                                      var z = document.createTextNode("added new dynamic class 
                                      attribute with the Bootstrap Framework");
                                      newDiv2.appendChild(t);
                                      newDiv2.appendChild(z);

                                      //CREATE NEW DIV3 ELEMENT
                                      const newDiv3 = document.createElement("a");
                                      //ATTRIBUTE FOR NEW DIV3 AND APPEND TO NewDiv
                                      newDiv3.setAttribute("href", "https://rockitwomen.com");
                                      newDiv3.setAttribute("target", "__blank");
                                      newDiv3.setAttribute("class", "mx-auto");
                                      newDiv3.appendChild(newContent);  
                                      newDiv.appendChild(newDiv3);

                                      // ADD NEW ELEMENTS AND CONTENT TO THE DOM
                                      const currentDiv = document.getElementById("viewEvent");
                                      document.body.insertBefore(newDiv, currentDiv);
                                      document.body.insertBefore(newDiv2, newDiv);
                                    }
                                
                            

Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.