Javascript Css类被jQuery覆盖

我正在使用库制作一些文本以适合div。 我的问题是，我应用于文本的附加样式被覆盖和忽略。例如，text align:left不再工作。列表点未显示。如何获得脚本的功能并添加css类

我这样调用bigText函数：

jQuery:

$(function() {
    $(window).on('resize', function() { 
        $(".area_competences_text").bigText();
    });

    $(window).trigger('resize');    
});

<div class="area_competences_text">    
    <ul>
        <li>SOME TEXT</li>
        <li>SOME TEXT</li>
        <li>SOME TEXT</li>
        <li>SOME TEXT</li>
        <li>SOME TEXT</li>
        <li>SOME TEXT</li> 
    </ul>                               
</div>

HTML:

$(function() {
    $(window).on('resize', function() { 
        $(".area_competences_text").bigText();
    });

    $(window).trigger('resize');    
});

<div class="area_competences_text">    
    <ul>
        <li>SOME TEXT</li>
        <li>SOME TEXT</li>
        <li>SOME TEXT</li>
        <li>SOME TEXT</li>
        <li>SOME TEXT</li>
        <li>SOME TEXT</li> 
    </ul>                               
</div>

---

您可以添加

！重要信息

设置为不被覆盖：

.area_competences_text {
    text-align: left !important;
etc.
}

---

你可以用！重要信息如下：

.area_competences_text {
    text-align: left !important;
    padding-top: 5%;
    padding-left: 5%;
    padding-right: 5%;
    padding-bottom: 5%;
}

$(function() {
        $(window).on('resize', function() { 
            $(".area_competences_text").bigText();
            $(".area_competences_text").css("text-align","left")
                                       .css("padding","5%");
        });
            $(window).trigger('resize');    
        });

---

您可以在不使用css的情况下执行此操作，如下所示：

.area_competences_text {
    text-align: left !important;
    padding-top: 5%;
    padding-left: 5%;
    padding-right: 5%;
    padding-bottom: 5%;
}

$(function() {
        $(window).on('resize', function() { 
            $(".area_competences_text").bigText();
            $(".area_competences_text").css("text-align","left")
                                       .css("padding","5%");
        });
            $(window).trigger('resize');    
        });

你可以添加！重要的

.area_competences_text {
    text-align: left !important;

} 

---

我要做的是向div添加一个ID或另一个类：

EX#1

HTML EX#2

HTML 当您添加ID或另一个类并引用这两个类时，您将更具体地了解需要设置的样式。

<div class="area_competences_text" style="text-align: left !important;">
...
</div>

...

您可以使用！重要的是你的cssI认为这是一个重复的避免使用！重要的标记。这将不起作用，因为jquery添加了样式内联，这将覆盖任何css。

<div class="area_competences_text" style="text-align: left !important;">
...
</div>