Question

I have structure like this

<div id="mali_oglasi">
    <p class="mali_oglas">
        <span class="name">Predaja7</span>
        <span class="body">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec urna eros, viverra nec porta vitae, luctus at ipsum. Pellentesque porta imperdiet purus, at pellentesque nisl lacinia et. Nam id justo do</span>
        <span class="contact_author">Saša</span>
        <span class="date_created">2012-03-13 14:36:30</span>
        <span class="date_expires">2012-04-12 14:36:30</span>
        <span class="email">[e-mail]</span>

        <span>Pirot</span>

        <span>Auto i Moto</span>
                                                                                                   <a class="obrisi" id="16">Obrisi</a>
        <a class="izmeni" id="16">Izmeni</a>
    </p>
    <p class="mali_oglas">
        <span class="name">Predaja6</span>

        <span class="body">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec urna eros, viverra nec porta vitae, luctus at ipsum. Pellentesque porta imperdiet purus, at pellentesque nisl lacinia et. Nam id justo do</span>
        <span class="contact_author">Saša</span>
        <span class="date_created">2012-03-13 14:36:19</span>
        <span class="date_expires">2012-04-12 14:36:19</span>
        <span class="email">[e-mail]</span>
        <span>Pirot</span>

        <span>Auto i Moto</span>
                                                                                                   <a class="obrisi" id="15">Obrisi</a>
        <a class="izmeni" id="15">Izmeni</a>
    </p>.....           
</div>

and JS:

$('.izmeni').on('click', function() {
    $(this).closest('.name').replaceWith('<input />');
});

I want to target span with class .name in the parent but nothing is happening???

Answer 1

You use closest to start beginning at the current element and progressing up through the DOM tree.

Using siblings targets your elements sisters and brother (other DOM elements with the same parent):

$('.izmeni').on('click', function() {
    $(this).siblings('.name').replaceWith('<input />');
}); 

Note: im not sure your using the on() method in the correct manner … the on() method should be a attached to a parent element of objects that are added after the DOM has loaded, like this :

$(parent).on('click', '.izmeni', function() {
    $(this).siblings('.name').replaceWith('<input />');
});

where parent is a parent of the actual element you are listening on, in your case mali_oglasi could be the parent if the a are to be added within that div