Answer by Grigory Kislin for Bootstrap 3 collapse change chevron icon on click

For change collapse icon in Bootstrap 4 with minimal html change, I've done

• Add to css:

  a[data-toggle="collapse"]:after {    font-family: 'Glyphicons Halflings';    content: "\e114";    float: right;    color: #4285F4;}a[data-toggle="collapse"].collapsed:after {    content: "\e080";}@font-face {    font-family: 'Glyphicons Halflings';    src: url('../fonts/glyphicons-halflings-regular.eot');    src: url('../fonts/glyphicons-halflings-regular.eot?#iefix') format('embedded-opentype'),    url('../fonts/glyphicons-halflings-regular.woff2') format('woff2'),    url('../fonts/glyphicons-halflings-regular.woff') format('woff'),    url('../fonts/glyphicons-halflings-regular.ttf') format('truetype'),    url('../fonts/glyphicons-halflings-regular.svg#glyphicons_halflingsregular') format('svg');}

• Put fonts in proper place, related to css:

  \css\style.css\fonts\glyphicons-halflings-regular.eot\fonts\glyphicons-halflings-regular.svg\fonts\glyphicons-halflings-regular.ttf\fonts\glyphicons-halflings-regular.woff\fonts\glyphicons-halflings-regular.woff2

• And add class="collapsed" to all collapsed (by default) links:

  <a href="#info" data-toggle="collapse" class="collapsed">Collapsed link</a><div id="info" class="collapse">