nicescroll, need to resize automatically when div changes it size

Question

I have <article> tag, which contains lot of text and it's usually showed with a jquery nicescroll beside, but if it contains an element which can change height 'some collapsable element) of the <article> tag and nicescroll doesn't want to reload.

my code:

<article class="item">
  <div class="reference">some text</div>
  <a href="#long-2" data-toggle="collapse" class="reference-long arr_down"></a>
  <div id="long-2" class="collapse">some text</div>
</div>

if I click on a, the article becomes bigger but I need to reload the nice scroll, when the collapsed item is clossed again, I need do the same.

jquery, which works just sometimes and doesn't work in the Safari browser:

$(document).ready(
function() {
$("article").niceScroll({cursorcolor:"#fff",autohidemode:false, zindex: 999});
}
);
$(function() {  
$('.reference-long').click(function(){
    $("article").getNiceScroll().remove();
    $("article").niceScroll({cursorcolor:"#fff",autohidemode:false, zindex: 999});
  });
});

Answer 1

Use resize() function instead of remove()

$("article").getNiceScroll().resize();