JSFiddle - React, Tailwind, and code Playground

HTML

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" href="css/style.css" />
<title>Sajt</title>
    
    <style type="text/css">
#accordion-container {font-size: 13px;background: #ffffff;padding: 5px 0 10px 0;}
.accordion-header {font-size: 24px;background: #425253;margin: 5px 0 0 0;padding: 12px 12px;    cursor: pointer;color: #fff;}
.active-header {    background: url(../img/active-header.png) #425253;background-repeat: no-repeat;    background-position: right 50%;}
.active-header:hover {background: url(../img/active-header.png) #289dc0;    background-repeat: no-repeat;background-position: right 50%;}
.inactive-header {background: url(../img/inactive-header.png) #425253;background-repeat: no-repeat;background-position: right 50%;}
.inactive-header:hover {    background: url(../img/inactive-header.png) #289dc0;background-repeat: no-repeat;background-position: right 50%;}
.accordion-content {    display: none;padding: 10px 0 10px 0;background: #ffffff;border-top: 0;    width:940px !important;}
.accordion-content p {color:#425253;font-family:Arial; font-size:15px;line-height:20px;}

.dvakratlevo {display: none;width: 460px; display:block;float:left;}

.dvakratdesno {display: none;width:460px; display:block;float:left;}
.clear {clear:both;}
</style>
</head>

<body>
    <div id="storitve">
        <div class="naslovi">
            <div id="accordion-container">
            <h2 class="accordion-header">Organizacija dogodkov in sejmov</h2>
            <div class="accordion-content">
                 <div class="dvakratlevo"><p>jkjkj<br>jkjkjk</p></div>
                 <div class="dvakratdesno"><img src="http://lorempixel.com/output/food-q-c-386-266-3.jpg"></div>
                <div class="clear"></div>
            </div>
            
            <h2 class="accordion-header">Promocija (materiali, gradiva, letaki, brošure)</h2>
            
            <div...

JavaScript

$(document).ready(function()
{
    //Add Inactive Class To All Accordion Headers
    $('.accordion-header').toggleClass('inactive-header');
    
    //Set The Accordion Content Width
    var contentwidth = $('.accordion-header').width();
    $('.accordion-content').css({'width' : contentwidth });
    
    // The Accordion Effect
    $('.accordion-header').click(function () {
        if($(this).is('.inactive-header')) {
            $('.active-header').toggleClass('active-header').toggleClass('inactive-header').next().slideToggle().toggleClass('open-content');
            $(this).toggleClass('active-header').toggleClass('inactive-header');
            $(this).next().slideToggle().toggleClass('open-content');
        }
        
        else {
            $(this).toggleClass('active-header').toggleClass('inactive-header');
            $(this).next().slideToggle().toggleClass('open-content');
        }
    });
    
    return false;
});