Javascript CSS HTML how to align a text and a button element in the div right next to each other? : I am trying to implement a text and a button right next to each other in the center of a relatively small height div.


I current made a div with width 100% and a height of 70px and appended a text that is centered in the middle of the div. I want to make a button that will be right next to the text.

Here is the code:

```
var temp = document.createElement("div");
temp.setAttribute("id", "bar");

$("#bar").css("width", "100%");
$("#bar").css("height", 70);
$("#bar").css("background-color", "white");

$("#bar").css({
  "display": "flex",
  "justify-content": "center",
  "align-items" : "center",
  "font-size": "20px",
  "font-weight" : "bold"
});

$("#bar").append("SOME TEXT");
```

Wanted result:

[[---------{"SOME TEXT" *button*}---------]]

That {"SOME TEXT" *button*} should be in the middle of that div.

Any helps would be much appreciated.