Rerun jquery function on resize noconflict

Question

I have this script

jQuery.noConflict();
(function ($) {
    $(".bww-carousel").jCarouselLite({
        btnNext: ".bww-carousel-next",
        btnPrev: ".bww-carousel-prev"
    });
    //add border to selected device
    $('a[onclick*="selectHandset"]').click(function () {
        $(".bww-carousel img").removeClass("active");
        $(this).parent().find("img").addClass("active");
    });
})
(jQuery);

which is in wordpress footer.php, I need to rerun jCarouselLite anytime the browser resizes.

I have tried:

jQuery.noConflict();
(function ($) {
    $(".bww-carousel").jCarouselLite({
        btnNext: ".bww-carousel-next",
        btnPrev: ".bww-carousel-prev"
    });
    //add border to selected device
    $('a[onclick*="selectHandset"]').click(function () {
        $(".bww-carousel img").removeClass("active");
        $(this).parent().find("img").addClass("active");
    });
})
$(window).resize(function() {
    jCarouselLite();
});
(jQuery);

as well as:

jQuery.noConflict();
(function ($) {
    $(".bww-carousel").jCarouselLite({
        btnNext: ".bww-carousel-next",
        btnPrev: ".bww-carousel-prev"
    });
    //add border to selected device
    $('a[onclick*="selectHandset"]').click(function () {
        $(".bww-carousel img").removeClass("active");
        $(this).parent().find("img").addClass("active");
    });
    $(window).resize(function() {
        jCarouselLite();
    });
})
(jQuery);

and

jQuery.noConflict();
var jCarouselLite = (function ($) {
    $(".bww-carousel").jCarouselLite({
        btnNext: ".bww-carousel-next",
        btnPrev: ".bww-carousel-prev"
    });
    //add border to selected device
    $('a[onclick*="selectHandset"]').click(function () {
        $(".bww-carousel img").removeClass("active");
        $(this).parent().find("img").addClass("active");
    });
    $(window).resize(function () {
        jCarouselLite();
    });
})
(jQuery);

all attempts have failed thus far, continue to get object is not a function (anonymous function) error in Chrome Console.

Suggestions?

Answer 1

function Runjcarousel(){ 
$(".bww-carousel").jCarouselLite({
    btnNext: ".bww-carousel-next",
    btnPrev: ".bww-carousel-prev"
});
//add border to selected device
$('a[onclick*="selectHandset"]').click(function () {
    $(".bww-carousel img").removeClass("active");
    $(this).parent().find("img").addClass("active");
});
}
$(document).ready(function(){
Runjcarousel();
});
//Call on window resize
$(window).resize(function() {
Runjcarousel();
});

Answer 2

With some help from Rohit, here's what finally worked for me (for any future readers)

jQuery.noConflict();
(function ($) {
    function Runjcarousel() {
        $(".bww-carousel").jCarouselLite({
            btnNext: ".bww-carousel-next",
            btnPrev: ".bww-carousel-prev"
        });
        //add border to selected device
        $('a[onclick*="selectHandset"]').click(function () {
            $(".bww-carousel img").removeClass("active");
            $(this).parent().find("img").addClass("active");
        });
    }
    $(document).ready(function () {
        Runjcarousel();
    });
    //Call on window scroll
    $(window).resize(function () {
        Runjcarousel();
    });
})
(jQuery);

There's probably a shorter way to write it, but it behaves with WordPress' version of jQuery and does what I needed it to do so I'm happy. Thanks for the help Rohit! Wouldn't have figured it out with your help! :)