Question

I have a Sharepoint site that is dynamically grabbing a name and description from a list.

var name = $(this).attr('ows_Title');  //This is the internal storage name in SP
var comments = $(this).attr('ows_MetaInfo').match(/^_Comments:SW\|(.*)$/m);

I am then taking these vars and feeding them into an empty div on my page (the div is called ‘docList’)

        var item = "<a class='docLinks' href='http:path/to/the/doc/" + name + "'>" 
+ title + "</a><br><p><span class='description' id='para_" + i + "'>"
    + comments + "</span></p><br>";
        $('#docList').append(item);

I am trying to make it so the ‘comments’ i.e. description of the item, appear on hover below the name of the item.

I have tried various iterations on this theme:

     $('#docList a').hover(function(){
          $(this).child().css({'display':'block'})},
          function(){
              $(this).child().css({'display':'none'});
         });

I know that I can access the hover event, because I coded in some simple alerts, and they were fine.

Originally, I tried giving each ‘comments’ its ownid (as you can see), but got tripped up in getting the index value. I then decided to try to do this using

      $(this).children('.description').css({'display':'block'});

But no luck. Am I close? Where am I screwing up the syntax?

Answer 1

$(this).nextUntil('p').next().find('.description').hide()

$(this).nextUntil('p').next().find('.description').show()

and you don’t need id for this