JSFiddle - React, Tailwind, and code Playground

HTML

<div id="kunstmuseum"></div>
<br/>

<input id="kunst_radio1" type="radio" name="kunstmuseum" value="0" checked="checked" onClick="animateDiv('kunstmuseum', 'nichts')">
<input id="kunst_radio2" type="radio" name="kunstmuseum" value="6794200" onClick="animateDiv('kunstmuseum', 'halb')">
<input id="kunst_radio3" type="radio" name="kunstmuseum" value="13588400" onClick="animateDiv('kunstmuseum', 'voll')">

CSS

#kunstmuseum {
left: 0;  
top: 0;  
height: 80px;
width: 11.5%;
background-color:#334D5C;
white-space: normal;
display: inline-block;
border-top: 0;
}

JavaScript

var mapping  = {
  kunstmuseum: {
    voll: 0,
    halb: 5.5,
    nichts: 11.5
   }
};
animateDiv = function(type, val) {


    var div = $('#' + type);
   
    if(div.data('originalWidth') == undefined)
    div.data('originalWidth', div.width());
    var widthPer = mapping[type][val];
  
    $('#' + type).animate({width:widthPer + '%'}, 500);
}