javascriptjquerywordpressreorganize

Rearrange divs by using data variables

I have the following page http://example.com (Yes, I know it's slow right now), but I need to rearrange the "dealers" under the correct states. Some of them are in the wrong location, using jquery I need to remove them and place them under the correct headers (There are no wrapping containers for each state).

I'm having a hard time doing this, how would I remove each Dealer (they have their own containers) with a data variable with the State value under the h4 with the matching state value? The data variable is data-state for each location and h4..

Solution

  • This will detach all of those dealerContainers, then append them back in their correct locations.

    $('.dealerContainer[data-state]')
  .detach()
  .each(function(i,e) {
    var state = $(e).data('state');
    var stateh5 = $('h5[data-state='+state+']');
    $(e).insertAfter(stateh5);
  })