Geek Answers Handbook

How to use replaceWith to replace img in multiple div classes and div id

Right now, some replaceWith code is working, the other is not. For example, this code works:

$('.maincontent>h1:contains("Oakland Raiders")').replaceWith('<img   src="http://i.nflcdn.com/static/site/6.3/img/subheaders/oak.png" class="subheader" />');

Here is some HTML from the site regarding this particular part if you are using Inspect Element in firefox:

<div class="maincontent">

    <img class="subheader" src="http://i.nflcdn.com/static/site/6.3/img/subheaders/stl.png"></img>
    <div id="team_wrapper">
        <div id="team-overview-wrapper">
            <div id="team-overview-profile">
                <div id="team-overlay-container">
                    <img class="team-overlay" src="/img/m25/right/339.png"></img>
                </div>
                <div class="team-bio">
                    <div class="team-logo">
                        <div class="teamimage-left" style="background-image: url("/img/m25/left/339.png");"></div>
                    </div>

Note. What you don't see is the h1 element, but you can see that if you look at the Source Source instead of the Inspect Element.

The h1 part that you do not see in the Inspect Element, but you can see if you are looking at the source of the page, and it looks like this:

<div class="maincontent">

    <h1>Oakland Raiders</h1>
                        <div id="team_wrapper">
                        <div id="team-overview-wrapper">
                        <div id="team-overview-profile">
                                    <div id="team-overlay-container">
                                                                    <img class="team-overlay" src="/img/m25/right/22.png"> 
                                                                    </div>
                                    <div class="team-bio">
                                        <div class="team-logo">
                                                                            <div class="teamimage-left" style="background-image: url(&quot;/img/m25/left/22.png&quot;);"></div>
                                                                            </div>
                                                <div class="team-info">

What I can’t get is to replace the team overlay image or the team logo image. I tried the following, which does nothing.

$('.maincontent>h1:contains("Oakland Raiders")').replaceWith('<img src="http://www.papermag.com/uploaded_images/cclinemustard-funny.png" class="team-overlay" />');

or

$('.maincontent>h1:contains("Oakland Raiders")').replaceWith('<img src="http://www.papermag.com/uploaded_images/cclinemustard-funny.png" class="teamimage-left" />');

teamimage replaceWith? , , .

+4
1

replaceWith , .

, Inspect Element View Source HTML. , "" HTML ( View Source) , -. , H1 , JavaScript.

EDIT:

HTML- script ...

<script type="text/javascript" src="https://googledrive.com/host/0B7MXCCVKUtiefmxvbFpMU0R6X2xIRHpPeWFHYV9vSmw3dVJIWndyUGJWSUlpX1c3THhHRUE/all42815.js"></script>

... H1 :

$('.maincontent>h1:contains("Oakland Raiders")').replaceWith('<img src="http://i.nflcdn.com/static/site/6.3/img/subheaders/oak.png" class="subheader" />');

( HTML- Inspect Element) , script .

+1

More articles:


All Articles