jQuery .show() a flex box

Question

I have an element with a flexbox

div#myFlexbox{
    display:flex;
}

after hide it and show it, it gets messed up.<

Answer 1

The class solution works, yes. Here's a different approach I came up with:

Javascript Function

function showFlex(element) {

    var flexContainer = document.getElementById(element);

    flexContainer.setAttribute("style", "display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex;");
}

To use it:

showFlex( "yourIDhere" );

Note that the ID doesn't need the # when you call the function.

Example:

https://codepen.io/florantara/pen/aLeyYb/