Drop down menu for posts as like twitter and facebook implemented

Question

I tried my best to implement a drop down menu as facebook and twitter does for their statuses but couldn't get the way. I did a lot of search but find no way. Here is my Markup:

<div class="drop">
    <a href="#" class="dropDown">Menu</a>
    <div class="down">
        <ul>
            <li>Edit</li>
            <li>Delete</li>
        </ul>
    </div>
    <!-- Post here !-->
</div>


<div class="drop" id="1">
    <a href="#" class="dropDown">Menu</a>
    <div class="down" data-url='1'>
        <ul>
            <li>Edit</li>
            <li>Delete</li>
        </ul>
    </div>
    <!-- Post here !-->
</div>


<div class="drop">
    <a href="#" class="dropDown">Menu</a>
    <div class="down">
        <ul>
            <li>Edit</li>
            <li>Delete</li>
        </ul>
    </div>
    <!-- Post here !-->
</div>

<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="js.js"></script>
<script type="text/javascript">
    $('.drop').drop();
</script>
<style type="text/css">
    .drop{
        display: inline-block;
        padding: 5px;
        background-color: #ddd;
        margin: 20px;
        cursor: pointer;
    }
    .down{
        display: none;

    }
</style>

I am using jQuery and here is the module:js.js

(function($){
    $.fn.drop = function(){
        this.each(function(){
            var self = $(this);
            self.on('click', function(){
                 $('.down').css('display', 'block');
            });
        });
    }
})(jQuery);

With this code when I click on any of the .drop element all of the .down elements are displayed. Sorry for any typos.
Every suggestion will be appreciated.

Answer 1

In script your selector is .down So, it will apply to all .down class Try to catch just child like this

(function($){
    $.fn.drop = function(){
        this.each(function(){
            var self = $(this);
            self.on('click', function(){
                 self.find('.down').css('display', 'block');
            });
        });
    }
})(jQuery);

I hope this will help you for now and in future.