Show div using jQuery, .toggleSlide doesnt work?
<p>I'm trying to show a div section using .slideToggle(), but it doesn't work.</p>

<p><strong>HTML:</strong></p>

<pre><code>&lt;form&gt;
        &lt;a href="#" class="add-sources"&gt;Add sources&lt;/a&gt;

                &lt;!-- Hide until Click --&gt;
                &lt;div class="add-sources-interaction" style="display: none;"&gt;
                        &lt;div class="form-group"&gt;
                            &lt;label for="source-1"&gt;Sources&lt;/label&gt;
                            &lt;input type="text" name="source-1" class="form-control" placeholder="Source #1" id="source-1"&gt;
                            &lt;input type="text" name="source-2" class="form-control" placeholder="Source #2" id="source-2"&gt;
                            &lt;input type="text" name="source-3" class="form-control" placeholder="Source #3" id="source-3"&gt;
                        &lt;/div&gt;
                &lt;/div&gt;
&lt;/form&gt;

        &lt;script src="//code.jquery.com/jquery-1.12.0.min.js"&gt;&lt;/script&gt;
        &lt;script src="//code.jquery.com/jquery-migrate-1.2.1.min.js"&gt;&lt;/script&gt;
        &lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"&gt;&lt;/script&gt;
        &lt;script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"&gt;&lt;/script&gt;
</code></pre>

<p><strong>jQuery:</strong></p>

<pre><code>$('.add-sources').click(function(){
    $('.add-sources-interaction').slideToggle("fast");
});
</code></pre>

<p>I get this error: </p>

<p><code>Uncaught Error: Bootstrap's JavaScript requires jQuery version 1.9.1 or higher, but lower than version 3
    at bootstrap.min.js:6
    at bootstrap.min.js:6</code></p>

<p>I'm using other jQuery functions throughout my application which seems to require the jQuery versions I'm importing.</p>

<p>I removed: </p>

<pre><code>&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"&gt;&lt;/script&gt;
</code></pre>

<p>.slideToggle() still doesn't work.</p>

<p><strong>EDIT:</strong></p>

<p>Complete files with <code>&lt;script&gt;</code> #1 and #3 replaced by <code>&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"&gt;&lt;/script&gt;</code> follow,</p>

<p><strong>master.blade.php:</strong></p>

<pre><code>&lt;!DOCTYPE html&gt;
&lt;html&gt;
    &lt;head&gt;
        &lt;title&gt;@yield('title')&lt;/title&gt;

       &lt;link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"&gt;
        &lt;link rel="stylesheet" href="{{ URL::to('src/css/main.css') }}"&gt; &lt;!--Gets absolute path --&gt;


    &lt;/head&gt;
    &lt;body&gt;
        @include('includes.header')
        &lt;div class="container"&gt;
            @yield('content')
        &lt;/div&gt;

        &lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"&gt;&lt;/script&gt;
        &lt;script src="//code.jquery.com/jquery-migrate-1.2.1.min.js"&gt;&lt;/script&gt;
        &lt;script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"&gt;&lt;/script&gt;
        &lt;script src="{{ URL::to('src/js/app.js') }}"&gt;&lt;/script&gt;
    &lt;/body&gt;
&lt;/html&gt;
</code></pre>

<p><strong>dashboard.blade.php:</strong></p>

<pre><code>@extends('layouts.master')

@section('content')
    @include('includes.message-block')
    &lt;section class="row new-post"&gt;
        &lt;div class="col-md-6 col-md-offset-3"&gt;
            &lt;header&gt; 
                &lt;h3&gt;What do you have to say?&lt;/h3&gt;
            &lt;/header&gt;

            &lt;form action="{{ route('post.create') }}" method="post" enctype="multipart/form-data"&gt;
                &lt;div class="form-group"&gt;
                    &lt;label for="title"&gt;Title&lt;/label&gt;
                    &lt;input type="text" name="title" class="form-control" placeholder="Your title" id="title"&gt;
                &lt;/div&gt;
                &lt;div class="form-group"&gt;
                    &lt;textarea class="form-control" name="body" id="new-post" rows="15" placeholder="Your Post"&gt;&lt;/textarea&gt;
                &lt;/div&gt;
                &lt;div class="form-group"&gt; &lt;!-- blade if statements which adds bootstrap class 'has-error' if field has error --&gt;
                    &lt;label for="category"&gt;Category&lt;/label&gt;
                    &lt;input class="form-control" type="text" name="category" id="category" placeholder="Categories, separate using comma."&gt; &lt;!-- Request::old fetch old value from form --&gt;
                &lt;/div&gt;
                &lt;div&gt;
                    &lt;label for="type"&gt;Article type&lt;/label&gt;
                    &lt;select name="type" class="form-control" id="type"&gt;
                        &lt;option value="News article"&gt;News article&lt;/option&gt;
                        &lt;option value="Opinion"&gt;Opinion&lt;/option&gt;

                    &lt;/select&gt;
                &lt;/div&gt;
                &lt;div class="form-group"&gt;
                    &lt;label for="image"&gt;Upload image&lt;/label&gt;
                    &lt;input type="file" name="image" class="form-control" id="image"&gt;
                &lt;/div&gt;

                &lt;a href="#" class="add-sources"&gt;Add sources&lt;/a&gt;

                &lt;!-- Hide until Click --&gt;
                &lt;div class="add-sources-interaction" style="display: none;"&gt;
                        &lt;div class="form-group"&gt;
                            &lt;label for="source-1"&gt;Sources&lt;/label&gt;
                            &lt;input type="text" name="source-1" class="form-control" placeholder="Source #1" id="source-1"&gt;
                            &lt;input type="text" name="source-2" class="form-control" placeholder="Source #2" id="source-2"&gt;
                            &lt;input type="text" name="source-3" class="form-control" placeholder="Source #3" id="source-3"&gt;
                        &lt;/div&gt;
                &lt;/div&gt;
                &lt;br&gt;&lt;/br&gt;

                &lt;button type="submit" class="btn btn-primary"&gt;Create Post&lt;/button&gt;



                &lt;input type="hidden" name="_token" value="{{ csrf_token() }}"&gt;
            &lt;/form&gt;

        &lt;/div&gt;
    &lt;/section&gt;

    @include('includes.newsfeed')
@endsection
</code></pre>

<p><strong>app.js:</strong></p>

<pre><code>var postId = 0;
var postBodyElement = null;

$('.post').find('.interaction').find('.edit').on('click', function(event){
    event.preventDefault();

    postBodyElement = event.target.parentNode.parentNode.childNodes[1];
    var postBody = postBodyElement.textContent; // event is argument passed through, target find .post, childNodes[1] find index 1
    postId = event.target.parentNode.parentNode.dataset['postid']; //access data-postid element within dashboard


    $('#post-body').val(postBody); //Sets post-body textarea value to var postBody                  
    $('#edit-modal').modal(); // Calls modal function within jQuery
}); 

$('#modal-save').on('click', function() {
    $.ajax({   //ajax function within jQuery, url and token gets specified within the dashboard.blade.php page.
        method: 'POST',
        url: urlEdit,
        data: { body:$('#post-body').val(), postId: postId, _token: token} //Data from textarea
    }) 
    .done(function (msg){
        $(postBodyElement).text(msg['new_body']); //How is msg and postController return connected?
        $('#edit-modal').modal('hide');
    });
});

$('.like').on('click', function(event){
    event.preventDefault();
    postId = event.target.parentNode.parentNode.dataset['postid'];
    var isLike = event.target.previousElementSibling == null; //Checks if it's a like or dislike.

    $.ajax({
        method: 'POST',
        url: urlLike,
        data: {isLike: isLike, postId: postId, _token: token}
    })
    .done(function(){
        //Change the page when .ajax has men executed.
        event.target.innerText = isLike ? event.target.innerText == 'Like' ? 'You like this post' : 'Like' : event.target.innerText == 'Dislike' ? 'You don\'t like this post' : 'Dislike';

        //Make sure you can't dislike and like at the same time.
        if(isLike){
            event.target.nextElementSibling.innerText = 'Dislike';
        } else {
             event.target.previousElementSibling.innerText = 'Like';
        }
    });
});

/* Opens subcomment-interaction */

$('.subcomment').click(function(){
    $('.subcomment-interaction').show();
});


/* Opens add-sources-interaction */
$('.add-sources').click(function(){
    $('.add-sources-interaction').slideToggle("fast");
});
</code></pre>