How to get parent of my element?

Question

<div class="list_desc clearfix">
    <div class="badge">
        <div class="badgetop">
            <p class="list_vote" id="l_val_1">20</p>
            <p class="list_vote_label">votes</p>
        </div>
        <div class="badgebottom" id="vl_1">
            <div><a href="#+1"/>+1</a></div>
            <div><a href="#-1"/>-1</a></div>
        </div>
        <div class="badgebottom" id="vl_2">
            <div><a href="#+1"/>+2</a></div>
            <div><a href="#-1"/>-2</a></div>
        </div>
    </div>
</div>

How do I change the text of #l_val_1 when I click +1 the text of #l_val_1 will be 21, -1 it will be 19? I want to use jQuery. Not using $(#l_val_1) directly because the id of class list_vote may have different value(like: #l_val_1 or #l_val_3) in a page of HTML

Answer 1

You can do like this

$(function(){
    $("div.badgebottom div a").click(function(){
        var node = $("div.badgetop p.list_vote");
        var nodeID = $("div.badgetop p.list_vote").attr("id");              
        node.text(eval(parseInt(node.text(),10) + $(this).text()));
    });
});

Working Demo

Answer 2

Try this:

$("div.badge div.badgebottom div a").click(function(){
   var elementToChange = $("div.badge div.badgetop p.list_vote");
   elementToChange.text((parseInt(elementToChange.text()) + parseInt($(this).text())).toString());
});