.listview () is not a functional error when creating a dynamic list in jQuery mobile

Question

I am trying to create a dynamic listview in jQuery mobile after requesting a facebook api to get a custom news feed. Here is part of my mark:

markup += '<li><a href=""><img src="https://graph.facebook.com/' + id + '/picture">'+'<h4>' + name + '</h4><p>' + short_post +'....</p></a></li>'; 

Then I,

  $(newsfeedposts).append(markup); $(newsfeedposts).trigger("create"); 

however after that when i call

 $(newsfeedposts).listview("refresh"); 

I get an error like: TypeError: $ (...). listview is not a function

My html div tag is

  <div data-role="content"> <div class ="post"> <ul data-role="listview" class="ui-listview" id="newsfeedposts" data-divider-theme="b" data-theme="a" data-overlay-theme="a" data-autodividers="true" data-inset="true"> </ul> </div> 

please let me know if you determine what I am doing wrong. It has been so long ...

Answer 1

You are not using jQuery-selector correctly. To direct an element with id, use $('#element_id') for an element with class $('.element_class') . So, your choice should be as shown below.

 $('#newsfeedposts').append(markup); 

and then

 $('#newsfeedposts').listview('refresh');