[TheRealso0sick]

Hi!

I'm trying to implement a jquery plugin
to one of my CMPS Modules.

I've added the HTML code to a BB code Module (very simple code),
the CSS to my main CSS/additional CSS
and added/linked the Jquery/Plugin in my headinclude template.
Though, the Jquery script does not seem to have any effect
on my html code and i can't figure out why.

Is anyone experienced with this and can tell me what i'm doing wrong?
When testing the exact same code on a external page, it worked perfectly fine.

Heres my code:
(The sources are correct btw)

Jquery/JS (in headinclude template)

<script src="http://code.jquery.com/jquery-1.7.1.js"></script>
<script src="jquery.kwicks-1.5.1.js"></script>
<script>
$().ready(function() {  
    $('.kwicks').kwicks({  
        max : 205,  
        spacing : 5  
    });  
});  
</script>

HTML (in CMPS BB code module)

<ul class="kwicks" >  
    <li id="kwick1">1</li>  
    <li id="kwick2">2</li>  
    <li id="kwick3">3</li>  
    <li id="kwick4">4</li>  
</ul>

CSS (in main/additional CSS)

.kwicks {  
    list-style: none;  
    position: relative;  
    margin: 0;  
    padding: 0;  
}  
.kwicks li{  
    display: block;  
    overflow: hidden;  
    padding: 0;  
    cursor: pointer;  
}  

.kwicks li{  
    float: left;  
    width: 125px;  
    height: 350px;  
    margin-right: 5px;  
}  
#kwick1 {   
    background-color: #53b388;  
    background-image: url('../images/meet.gif');  
}  
#kwick2 {  
    background-color: #5a69a9;  
    background-image: url('../images/kwicks.gif');  
}  
#kwick3 {  
    background-color: #c26468;  
    background-image: url('../images/for.gif');  
}  
#kwick4 {   
    background-color: #bf7cc7;  
    background-image: url('../images/jquery.gif');  
    margin-right: none;  
}

Any help is greatly appreciated!