Replace Div with another Div

Question

I have this thing I m trying to do  I have a main picture of a map and within that map there are regions  These regions have hot spots on them so you can click them and it will replace the whole map with only the region   just a simple div swap     I need it as a div because in this div i have the hot spots listed    There are a total of 4 divs that I am going to need to do this with    If anyone could help me that would be awesome   So links that are listed in a table need to replace the image in a separate div     lt tr class  thumb  gt  lt  tr gt   lt td gt All Regions  shows main map   link  lt  td gt   lt  tr gt    lt tr class  thumb  gt  lt  tr gt   lt td gt Northern Region  link  lt  td gt   lt  tr gt    lt tr class  thumb  gt  lt  tr gt   lt td gt Southern Region  link  lt  td gt   lt  tr gt    lt tr class  thumb  gt  lt  tr gt   lt td gt Eastern Region  link  lt  td gt   lt  tr gt   lt  table gt     lt div gt All Regions image lt  div gt   lt div gt northern image lt  div gt   lt div gt southern image lt  div gt   lt div gt Eastern image lt  div gt    I am not allowed to post images because I don t have enough points so I know the image links wont work

User · Answer

HTML      lt div id  replaceMe  gt i need to be replaced lt  div gt   lt div id  iamReplacement  gt i am replacement lt  div gt    JavaScript  jQuery   replaceMe   replaceWith jQuery   iamReplacement

User · Answer

This should help you  HTML   lt  -- pretty much i just need to click a link within the regions table and it changes to the neccesary div  -- gt    lt table gt   lt tr class  thumb  gt  lt  tr gt       lt td gt  lt a href     class  showall  gt All Regions lt  a gt   shows main map   link  lt  td gt       lt tr class  thumb  gt  lt  tr gt   lt td gt Northern Region  link  lt  td gt   lt  tr gt    lt tr class  thumb  gt  lt  tr gt   lt td gt Southern Region  link  lt  td gt   lt  tr gt    lt tr class  thumb  gt  lt  tr gt   lt td gt Eastern Region  link  lt  td gt   lt  tr gt   lt  table gt   lt br   gt    lt div id  mainmapplace  gt       lt div id  mainmap  gt          All Regions image      lt  div gt   lt  div gt   lt div id  region  gt       lt div class  replace  gt northern image lt  div gt       lt div class  replace  gt southern image lt  div gt       lt div class  replace  gt Eastern image lt  div gt   lt  div gt    JavaScript  var originalmap  var flag   false     function              replace   click function                flag   true              originalmap       mainmap                    mainmap   replaceWith   this                         showall   click          function                if flag    true                       region   append     mainmapplace  replace                                         mainmapplace   children   remove                        mainmapplace   append   originalmap                          mapplace   append                                        CSS   mainmapplace      width  100px      height  100px      background  red      region div      width  100px      height  100px      background  blue      margin  10px 0 0 0

User · Answer

You can use  replaceWith     x000D   x000D    function     x000D   x000D        region   click function e    x000D      e preventDefault    x000D      var content     this  html    x000D          map   replaceWith   lt div class  region  gt     content     lt  div gt     x000D        x000D   x000D      x000D   lt script src  https   ajax googleapis com ajax libs jquery 2 1 1 jquery min js  gt  lt  script gt  x000D   x000D   lt div id  map  gt  x000D     lt div class  region  gt  lt a href  link1  gt region1 lt  a gt  lt  div gt  x000D     lt div class  region  gt  lt a href  link2  gt region2 lt  a gt  lt  div gt  x000D     lt div class  region  gt  lt a href  link3  gt region3 lt  a gt  lt  div gt  x000D   lt  div gt  x000D   x000D   x000D

[jquery] Replace Div with another Div

Examples related to jquery

Examples related to html

Examples related to swap