Unable to display a jquery plugin's colorbox in a wordpress site

After checking a few related questions in stackoverflow and wordpress.stackexchange.com, I am not being able to display a colorbox in my wordpress site, in localhost, when I add the code below to the of my header.php:

<link rel="stylesheet" href="localhost/apoise/wp-content/themes/virality/colorbox-master/example1colorbox.css">
<script src="http://ift.tt/17YXcKA"></script>
<script src="localhost/apoise/wp-content/themes/virality/colorbox-master/jquery.colorbox.js"></script>
<script type="text/javascript">
jQuery.noConflict();
    $(document).ready(function () {
    $.colorbox({
        width: 500,
        height: 600,
        href: "#colorbox_text"
        )};
    });
</script>

</head>

In a post, I placed the html:

<div id="colorbox_test" style="border: 1px solid black">
    <p> This is supposed to display when the colorbox function is called </p>
</div>

No box is displaying when any of the posts load. Do I need to specify a location? Or is it errors in the code?