Two javascript conflicting with each other

I have two different javascript code that load when page load happens in my sharepoint site wiki page. But it looks like they are fighting with each other.

First javascript I am using it to get logged in users profile image.

Second Script I am using to load a slider in my page.

When I load both together User Profile Javascript works but Slider doesnt.

But when I separate them into two different wiki page they both work.

Here is Userprofile Script I load

    <script type="text/javascript">


    ExecuteOrDelayUntilScriptLoaded(getUserProfileImage,'sp.js');

    var CamlResult;
    function getUserProfileImage(){
        var clientContext = new SP.ClientContext.get_current();
        var web = clientContext.get_web();
        var userInfoList = web.get_siteUserInfoList();
        var camlQuery = new SP.CamlQuery();

    var userID = _spPageContextInfo.userId;

    // define the query to retrieve the given user's details
    camlQuery.set_viewXml('<View><Query><Where><Eq><FieldRef Name="ID"/><Value Type="Number">' + userID + '</Value></Eq></Where></Query><RowLimit>1</RowLimit></View>');

    CamlResult = userInfoList.getItems(camlQuery);
    clientContext.load(CamlResult);
    clientContext.executeQueryAsync(Function.createDelegate(this, this.onQuerySucceeded),Function.createDelegate(this, this.onQueryFailed));
}

function onQuerySucceeded(sender, args){
    var profile, title, login, email, pic, picUrl;

    // There should be only result. Get the item at index 0
    profile = CamlResult.itemAt(0); 

    // read all the properties out

    title = profile.get_item("Title");
    login = profile.get_item("Name");
    email = profile.get_item("EMail");
    pic = profile.get_item("Picture");

    if (pic) { 
        picUrl = pic.get_url();


    } 

    // Setup HTML
    document.getElementById('userLoginName').innerHTML = login;
    document.getElementById('userTitle').innerHTML = title;
    document.getElementById('userEmail').innerHTML = email;


    if (picUrl) {
        // create the image
        imgMyPicture = document.createElement('img');


        imgMyPicture.setAttribute('src', picUrl);
        imgMyPicture.setAttribute('title', 'Image from Current Users Profile');
        imgMyPicture.setAttribute('alt', 'Profile Picture');

        // append the image
        document.getElementById('userPicture').appendChild(imgMyPicture);


    }
    else {
        document.getElementById('userPicture').innerHTML = "No image found in user profile";
    }
}

Slider Script:

    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/jquery.SPServices/0.7.1a/jquery.SPServices-0.7.1a.min.js"></script>
 <script type="text/javascript" src="../SiteAssets/unslider.min.js"></script>

    <style type="text/css">
   .hillbillyBanner { position: relative; overflow: auto;  }
      .hillbillyBanner li { list-style: none; background-repeat: no-repeat; }
           .hillbillyBanner ul li { float: left;height:200px; }
               .hillbillyBanner ul {margin-left: -40px;}
               .hillbillyBanner ul li div p{padding-left:270px;}

       </style>

  <script type="text/javascript">

         jQuery(document).ready(function($) {

           var sliderList = "Slider"; // Name of the list that contains slides
            var slideContentField = "HTML"; //Name of the Rich text field that has slide content
            var slideBackgroundImageField = "Picture"; //Name of the picture field to use as background image
            var slidetitlefield="Title";


                 HillbillySlider(sliderList,slideContentField,slideBackgroundImageField,slidetitlefield);






       });


       function HillbillySlider(sliderList,slideContentField,slideBackgroundImageField,slidetitlefield) {

          //query to retrieve all items
          var query = "<Query><Where><Neq><FieldRef Name='ID' /><Value Type='Number'></Value></Neq></Where></Query>";

         //return fields for slide content, background picture and title
          var camlViewFields = "<ViewFields><FieldRef Name='"+slideContentField+"' /><FieldRef Name='"+slideBackgroundImageField+"' /><FieldRef Name='"+slidetitlefield+"' /></ViewFields>";

         $().SPServices({
                operation: "GetListItems",
               async: true,
               listName: sliderList,
            CAMLViewFields: camlViewFields,
              CAMLQuery: query,
             completefunc: function(xData, Status) {
  $(xData.responseXML).SPFilterNode("z:row").each(function() {
                    var slideContent = ($(this).attr("ows_"+slideContentField));
                    var slideTitle = ($(this).attr("ows_"+slidetitlefield));

                     var picture = $(this).attr("ows_"+slideBackgroundImageField)==undefined?"":$(this).attr("ows_"+slideBackgroundImageField).split(",")[0];
                    //create slide (li) and append it to other slides
                     $("#hillbillySlider").append("<li style=\"background-image: url('"+picture +"');\"> <span style=\"padding-left:270px;font-weight: bold;\">"+slideTitle+"</span>"+slideContent+"</li>");

                }); // end completefunc
                //start the slider
               $('.hillbillyBanner').unslider();
               }
          }); // end SPServices call
        }
   </script>

  <div class="hillbillyBanner">
  <ul id='hillbillySlider'></ul>


  </div>

Can you please help me find what is fighting here and what can i do to make them load together?